jquery - 隐藏加载大量 JQuery 时在页面开始时发生的闪烁和其他脏效果

Question

我正在构建一个网站，我可以注意到我在 JQuery 正文中添加的代码越多，

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

加载网站的第一秒出现的更烦人的效果。我可以看到所有未样式化的元素，然后移动/被转换，直到我在一秒钟后达到研究的外观和感觉。

现在只需要一秒钟，但我无法想象在开始生产时会出现这样的显示错误。

你们中有人习惯处理这种效果吗？您会推荐什么？

非常感谢大家;)

更新:我没有通过 JQuery 做任何丑陋的 CSS。我只是碰巧使用了一些不同的插件。最烦人的是我正在使用的 Jqx 菜单。在 Jquery 完成转换之前，我可以看到文本未设置样式。

Answer 1

您可以隐藏页面内容，然后在页面加载完成后再次显示。

将其放在开始正文标记之后:

<script type="text/javascript"> 
    $('body').hide(); 
    $(window).load(function() { $('body').show(); }); 
</script>

并不是说这是最好的方法，但它应该可以防止样式闪烁。