我正在使用一种相当标准的淡入技术 <body>使用 jQuery，同时保持它对那些没有启用 JavaScript 的用户可见。
在CSS中，我设置
body.has-js {
display:none;
}
然后我添加 .has-js在 <head> 中使用以下 jQuery 片段部分:
<script>
jQuery(document).ready(function($) {
$("body").addClass("has-js");
});
window.onload = function() {
jQuery("body").fadeIn(500);
}
</script>
期望的结果是让网站最初不可见，然后在加载所有内容后让它平滑地淡入淡出。
问题:显然，内容在 JavaScript 启动之前加载，因此在添加 .has-js 类之前页面会短暂闪烁。这在除 Firefox 之外的所有浏览器中都会发生。
问题:我怎样才能消除闪烁，同时仍然让那些禁用了 JavaScript 的用户看到网站？
最佳答案
试着把这个放在你的开头之后 <body> :
<script>
(function () {
var elements = document.getElementsByTagName("body");
var body = elements[0];
body.className = "has-js";
})();
</script>
在您的场景中您实际上不需要等待 DOM 加载，并且无论何时加载此脚本，您都可以保证至少 body元素可用。
如果您的 body已经在 HTML 中分配了一个类，将最后一行替换为以下内容:
body.className += " has-js";
关于javascript - 消除 fadeIn blink，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16857879/