当在jquery中使用隐藏和显示时不想要的“闪烁”效果(unwanted “flickering” effect when using hide and show in jquery)

当在jquery中使用隐藏和显示时不想要的“闪烁”效果(unwanted “flickering” effect when using hide and show in jquery)

当在某些div上使用jQuery“show”和“hide”时，Firefox中出现令人讨厌的“闪烁”效果。 任何想法，当这可能发生？

I'm getting an annoying "flickering" effect in Firefox when using jQuery "show" and "hide" on some div's. Any idea when this could be happening?

最满意答案

取决于你闪烁的意思（如果它只在页面加载时闪烁），而不是：

$(document).ready(function(){ $("hide").hide(); }); <div id="hide">My Hidden Text</div>

尝试在CSS中添加display：none：

<div id="hide" style="display:none">My Hidden Text</a>

CSS甚至在JavaScript允许操纵之前就被应用到DOM，所以如果你这样做，当你加载页面时不应该有闪烁。

另外值得注意的是，在Firefox中，当你改变窗口的大小（垂直），并且当前的滚动位置接近或者在窗口的底部时，有一个错误会导致窗口闪烁。

Depending on what you mean by flicker (if it only flickers when the page loads), instead of doing:

$(document).ready(function(){ $("hide").hide(); }); <div id="hide">My Hidden Text</div>

Try adding display:none in the CSS:

<div id="hide" style="display:none">My Hidden Text</a>

CSS is applied to the DOM before even JavaScript is allowed to manipulate it, so if you do this, there should be no flicker when you load the page.

Also of note, in Firefox, there is a bug that causes the window to flicker when you change the size of the window (vertically), and the current scroll position is close or at the bottom of the window.