当文档准备好时调用 hide() 时闪烁
当文档在默认情况下具有 display:block
和 visibility:visible
的特定
上准备好时,我调用 hide() 函数(我们默认情况下显示它,我们尝试使用 jQuery 隐藏它)。有时,当我刷新页面时,
会在不到一秒的时间内出现,然后根据 hide()
函数消失。我的问题:有没有办法避免这种
闪烁?谢谢
I call hide() function when document ready on a specific <div>
that has display:block
and visibility:visible
by default (we show it by default, and we try to hide it with jQuery).
Sometimes when I refresh the page the <div>
appears during a fraction of a second then disappears according to the hide()
function.
My question: is there a way to avoid this <div>
twinkling ?
Thanks
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
这是渲染元素和执行 JS 代码之间的时间。
避免这种情况的方法不是将代码放在 DOM-ready 事件中,而是放在元素后面:
当然,任何其他内容(例如注册事件处理程序)仍然可以进入 DOM-ready 函数。
哦,您根本不需要使用
visibility
-show()
和hide()
将仅使用display无论如何,属性。
如果您要隐藏的元素是“请启用 JavaScript”警告,请考虑使用
- 那么除非禁用 JS,否则它将永远不会显示。
It's the time between rendering the element and executing your JS code.
The way to avoid this is not putting the code in the DOM-ready event but right after the element:
Anything else such a registering event handlers can still go into your DOM-ready function of course.
Oh, and you don't need to use
visibility
at all -show()
andhide()
will only use thedisplay
property anyway.In case the element you want to hide is a "please enable JavaScript" warning, consider using
<noscript>...</noscript>
- then it will never show up unless JS is disabled.是的,默认可见性:隐藏,并显示()您想要的。或者,在加载 html 后立即调用 hide() ,并在相关 html 之后使用 $('...').hide() 。
发生“闪烁”的原因是,一旦 html 到达浏览器,该块就会被加载,但是隐藏它的 jquery 直到所有 html 被浏览器加载并且 DOM 准备就绪之后才会执行。
Yes, default visibility:hidden, and show() the ones you want. Alternatively, call hide() immediately after loading the html with $('...').hide() right after the relevant html.
The'twinkling' happens because the block is loaded as soon as the html hits the browser, but the jquery to hide it isn't executed until after all the html is loaded by the browser and the DOM is ready.