javascript - 如何在文档就绪时隐藏滑动 div

Question

.nav我试图通过单击另一个 div ( ) 来上下滑动div ( #toggleMenu)

现在我的问题是当我运行页面时 ( .nav) div 弹出得非常快。我用 $(".nav").hide();来隐藏 div，但这是在.nav非常快速地加载 ( ) 之后发生的。

这是我的代码

$(document).ready(function() {
    $(".nav").hide(); 
    $("#toggleMenu").click(function () {
        $('.nav').slideToggle();
    });
});

CSS样式如下：

.nav {
    border: 0px solid #ccc;
    border-width: 0px 0;
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: left;
}

score 1 · Accepted Answer

如果我理解正确，该.nav元素会在页面加载时隐藏之前闪烁。

您可以将 display:none 添加到规则中，并比 JavaScript 更快地.nav跳过CSS 加载。$(".nav").hide();

请记住，如果有人禁用了 JavaScript，它不会优雅地回退。

另一种选择是slideUp()在文档就绪时使用平滑动画，例如。这样，您的页面在加载时不会看起来很奇怪。

1 回答 1