Question

即时通讯使用jquery ui标签。

有时当我的页面加载时，每个标签的所有html都显示在页面上，然后在标签显示和html位于标签内之前需要一些时间。从一个ui的角度来看，这个最初的闪烁很烦人..有没有办法克服它？

Answer 1

您正在等待html渲染，这就是您使用$(document).ready()或速记的原因。

你可以做的是你应该放在标签部分（html）

<script>$('#tab').tab()</script> //或.tabs（）cnt记住

然后它会动态执行，请注意jQuery核心文件应该在头部：）

Answer 2

因为嵌入jquery的正确方法是使用

$(document).ready(function(){
  ...
}

jQuery将在所有页面完成加载后执行。这是100％的意图。

你可以使用的一个技巧是添加一些JS，仍然使用jQuery但在函数之外 $（文件）。就绪（函数（）{ ... }

// Class indicating that JS is enabled                                                                                                                                           
$('html').addClass('js');

然后，在你不想忽略的东西旁边找到最近的CSS类，并添加一些CSS

/**
 * For anything you want to hide on page load when JS is enabled, so
 * that you can use the JS to control visibility and avoid flicker.                                                                                                                                         
 */
html.js .myClass {
  display: none;
}

然后，当然，你需要使用一些JS来处理.myClass的可见性，以便根据我们在CSS规则中定义的内容来显示它。

这将display: none闪烁的东西一样快，你将无法看到它闪烁。

Answer 3

有同样的问题。
我声明了标签“display：none;”在我的CSS中当jQuery.tab（）触发时，它应该正确呈现。

Answer 4

一种不太好的方法是使用z-index设置100％高度和宽度覆盖，以隐藏页面的所有内容，直到完成所有ui渲染。

Answer 5

一个选项是修改辅助选项卡（那些没有首先出现的选项）z-index属性，并在回调中将原始值再次放回。

在渲染所有htm之后加载jquery ui tabs

5 个答案: