代码之家 › 专栏 › 技术社区 › adardesign

jQuery,在ready上隐藏元素总是在页面加载时跳转。如何避免这种情况?

document-ready css jquery

1

adardesign · 技术社区 · 15 年前

这是密码。

我不能申请 display:none;

$(document).ready(function() {
    $("#LeftNav li.navCatHead").not(":first").siblings("li").hide().end().end().first().addClass("open");
});

5 回复 | 直到 15 年前

1

2

JiJ 15 年前

为什么你不能设置“display:none"? 不确定您的场景,但您可能可以稍微反转工作流程

尝试隐藏,而不是最初显示列表,然后根据某些条件隐藏某些列表(display:none)首先列出,然后根据某些条件显示某些列表。

这样你就不会以一些元素“先显示后消失”而告终。

2

1

justkt 15 年前

而不是申请 display:none $.hide() ),将要隐藏的项替换为与要隐藏的项大小相同的空div如何?

3

1

David Murdoch 15 年前

            <!-- ...other code... -->
            <li>Sibling</li>
        </ul>
        <script type="text/javascript">
            // this should work...
            $("#LeftNav li.navCatHead").not(":first").siblings("li").hide().end().end().first().addClass("open");
        </script>
        <div class='content'>more stuff.</div>
    </body>
</html>

4

1

Daniel 10 年前

我经常发现这是一个很好的选择 display:none; 正在将加载时的不透明度设置为0。

$("#LeftNav li.navCatHead").not(":first").siblings("li").css('opacity','0').end().end().first().addClass("open");

但是,与其用这么长的字符串来查找选择器,我只需要在每个类中添加一个新类并将其设置为 opacity: 0; 在页面加载,因为它会快得多。