jQuery jquery淡入淡出元素不显示样式为“可见性：隐藏”的元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2435751/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery fade element does not show elements styled 'visibility: hidden'
提问by kalpaitch
I have a bunch of thumbnails which I am loading with a style of visibility: hidden;so that they all maintain their correct layouts. Once the page is fully loaded I have a jquery function that fades them in. This worked when their style was set to display: none;but obviously the layout screwed up then. Any suggestions?
我有一堆缩略图，我正在加载visibility: hidden;它们的样式，以便它们都保持正确的布局。页面完全加载后，我有一个 jquery 函数将它们淡入淡出。当它们的样式设置为时，这有效，display: none;但显然布局搞砸了。有什么建议？
Heres the fade line:
这是淡出线：
$('.littleme').fadeIn('slow');
回答by Nick Craver
Add a few calls to the chain like this:
像这样向链添加一些调用：
$('.littleme').css('visibility','visible').hide().fadeIn('slow');
This will change it to display:nonefor 1 frame before fading in, occupying the area again.
这将display:none在淡入之前将其更改为 1 帧，再次占据该区域。
回答by David Hellsing
try using opacity and animate():
尝试使用不透明度和animate()：
$('.littleme').css('opacity',0).animate({opacity:1}, 1000);
回答by user
<span style="opacity:0;">I'm Hidden</span>
<span style="opacity:0;">I'm Hidden</span>
To Show : $('span').fadeTo(1000,1)
显示 ： $('span').fadeTo(1000,1)
To Hide : $('span').fadeTo(1000,0)
隐藏 ： $('span').fadeTo(1000,0)
The space is preserved in the DOM layout
空间保留在 DOM 布局中
回答by Neil
Cant you use fadeTo(duration, value) instead? Surely this way you can fade to 0 and 1, that way you are not affecting the document flow...
你不能用fadeTo(duration, value)代替吗？当然，通过这种方式您可以淡入 0 和 1，这样您就不会影响文档流......
回答by iivel
Try matching for the hidden element?
尝试匹配隐藏元素？
$(".littleme:hidden").fadeIn();
$(".littleme:hidden").fadeIn();
