Question

我有以下网站：

http://cassidoo.public.iastate.edu/

我在菜单中使用JQuery UI Tabs。加载页面时，选项卡中会有一段内容。

我已经尝试了从ui-tabs-hide技巧到Javascript隐藏内容的所有内容。有缺点我不知道吗？我该怎么办？

感谢您的帮助！

Answer 1

我遇到了类似的情况，这就是我解决这个问题的方法：

（1。）定义一个名为“hide”的css类，并将其设置为“display：none”

（2.）在每个div中使用“contentpanel”类，在旁边添加“hide” 它在你的标记中。这将确保页面加载显示
没有，而不是等待javascript来处理它。

（3。）创建jquery.ui.tabs选择器时，使用 “tabscreate”方法从内容中删除“隐藏”类面板。所以你的选择器看起来像这样：

  //define tabs instance 
   $( "#tabs" ).tabs({

        create: function( event, ui ) {
           //when tabs are created, remove your class .hide from each content panel
           //so jquery tabs will control when panel content will surface
           $(your contentpanel selector).removeClass(hide);
        }
     //whatever else you need to do
     ....
     ...
     ..
    });

要了解有关jQuery UI标签内部方法的更多信息，请阅读：

http://api.jqueryui.com/tabs/

并阅读

create（event，ui）

希望这有帮助。

克里斯

页面加载时，jQuery选项卡闪烁（FOUC）

1 个答案: