jquery - 在 fadeIn 之前短暂出现 - jQuery

Question

我在尝试使淡入正常工作时遇到问题。网站的主要部分(可能包含图像、文本等，并且是浏览网站时唯一发生变化的部分；页眉和页脚是静态的)通过淡入进入。我使用以下代码使其工作:

<script type="text/javascript" language="JavaScript">
$(document).ready(function() {
$("div.main").css("display", "none");
$("div.main").fadeIn(2000);
});
</script>

我还尝试了以下方法:

<script type="text/javascript" language="JavaScript">
$(document).ready(function() {
$("div.main").css("visibility", "visible").hide().fadeIn(2000);
});
</script>

两者的问题是，当在各个部分之间移动时，我可以快速浏览一下这个主 div，然后它就会消失并第二次通过淡入进入。这可能是“正常”行为吗？我该如何解决它？

我感谢任何指导。

编辑:

我确实尝试了样式表上的“display:none”属性，但是，我没有看到主 div，而是在标题下方看到页脚，直到主要内容淡入。另外，如果有一些用户禁用了 javascript，他们根本看不到任何内容。我还在 css 上尝试了“visibility:hidden”，但淡入淡出不起作用。

编辑 2 [已解决]:

我终于成功地将“display:none”移动到CSS中，然后，为了解决禁用JavaScript的困境，我遵循了这篇文章的建议(http://greatwebguy.com/programming/css/writing-javascript-specific-css/)。希望可以发布该链接，以防其他人发现它有用。

谢谢你们的帮助:)

Answer 1

$("div.main").css("display", "none");

此函数调用仅在文档准备好时才会触发。尝试使用 CSS 而不使用 JS 在页面渲染之前隐藏元素。