jquery fade元素不显示样式为'visibility:hidden'的元素

Question

我有一堆缩略图,我正在加载一种风格,visibility: hidden;以便他们都保持正确的布局.一旦页面完全加载,我就有了一个淡入淡出的jquery函数.当它们的样式被设置为时,这很有用,display: none;但显然布局搞砸了.有什么建议？

继承人的淡出线:

$('.littleme').fadeIn('slow');

Answer 1

像这样添加一些对链的调用:

 $('.littleme').css('visibility','visible').hide().fadeIn('slow');

这将display:none在淡入之前将其更改为1帧,再次占据该区域.

@eruciform - 最后消除`display:none`,你可以做`$('.littleme').fadeTo(speed,0);`,最后不会设置`display`,同样减少工作效果:) (5认同)
反之:`$('.littleme').fadeOut(speed,function(){$('.littleme').css("visibility","hidden").css("display",""); });`:-) (2认同)
`$('.littleme').fadeTo(speed, 0, function(){ $(this).hide();});` 用于在动画结束后将其设置为 `display:none`。感谢@NickCraver 提供原始片段:) (2认同)

Answer 2

尝试使用不透明度animate():

$('.littleme').css('opacity',0).animate({opacity:1}, 1000);

Answer 3

<span style="opacity:0;">I'm Hidden</span>

显示 : $('span').fadeTo(1000,1)

隐藏 : $('span').fadeTo(1000,0)

该空间保留在DOM布局中