jQuery,在就绪时隐藏元素总是在页面加载时跳转。如何避免这种情况?
这是代码。
我无法应用 display:none;
$(document).ready(function() {
$("#LeftNav li.navCatHead").not(":first").siblings("li").hide().end().end().first().addClass("open");
});
This is the code.
I can't apply display:none;
$(document).ready(function() {
$("#LeftNav li.navCatHead").not(":first").siblings("li").hide().end().end().first().addClass("open");
});
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(5)
为什么不能设置“display:none”?不确定您的场景,但您可能可以稍微反转工作流程
,而不是最初显示列表,然后根据某些条件隐藏某些列表,最初尝试隐藏(显示:无)列表,然后根据某些条件显示某些列表。
这样,您就不会出现某些元素“显示然后消失”的情况。
why can't you set "display:none"? Not sure about your scenario, but you probably can reverse the work flow a little bit
instead of show list initially, then hide certain ones based on some condition, try hide(display:none) lists initially, then show certain ones based on some condition.
This way you don't end up with some elements "show then disappear".
不应用
display:none
(调用$.hide()
),不如将您尝试隐藏的项目替换为设置为相同值的空 div大小与您想要隐藏的内容相同?Instead of applying
display:none
, (calling$.hide()
), how about replacing the item you are trying to hide with an empty div that is set to the same size as whatever you are trying to hide?不要等待文件准备好。您可以将 jQuery 代码放置在页面底部的结束正文标记之前,或者直接放置在相关元素之后。
Don't wait for document ready. You can place your jQuery code at the bottom of the page before the closing body tag or alternatively, immediately after the elements in question.
我经常发现
display:none;
的一个不错的替代方案是在加载时将不透明度设置为 0。但我不会用这么长的字符串来查找选择器,而是为每个选择器添加一个新类,并在页面加载时将其设置为
opacity: 0;
,因为这样会快得多。I often find that a nice alternative for
display:none;
is setting the opacity to 0 on load.But rather than have such a long string to find the selector, I would just add a new class to each one and set that to
opacity: 0;
on page load as it will be much much faster.我遇到了同样的问题,我使用了 JQuery 的
.hide()
函数,但是因为我将放在正文末尾,所以元素瞬间可见,直到浏览器可以到达代码末尾并运行隐藏功能。
对于解决方案,我提高了
.hide()
函数的速度,直到它快到用户看不到它为止。这对我有用。
现在我的函数看起来像这样。
希望它有所帮助,这是我第一次在我们最喜欢的社区上回答问题。干杯。
I had the same problem, I used JQuery's
.hide()
function but because I placed the<script>
at end of body the elements were visible for split second till the browser could reach the end of code and run the hiding function.For the solution I increased the speed of
.hide()
function till it was so fast that the user can't see it.It worked for me.
So now my function looks something like this.
Hope it helped, this was the first time I answered a question on our fav community. Cheers.