web-dev-qa-db-ja.com

jquery fade要素は、「可視性：非表示」スタイルの要素を表示しません

visibility: hidden;のスタイルで読み込んでいるサムネイルがたくさんあるので、それらはすべて正しいレイアウトを維持します。ページが完全にロードされると、それらをフェードインするjquery関数があります。これは、スタイルがdisplay: none;に設定されたときに機能しましたが、明らかにレイアウトが台無しになりました。助言がありますか？

フェードラインは次のとおりです。

$('.littleme').fadeIn('slow');
jqueryvisibilityfadein
71
kalpaitch

次のように、チェーンにいくつかの呼び出しを追加します。

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

これにより、フェードインする前に1フレームの間display:noneに変更され、再び領域が占有されます。

151
Nick Craver

不透明度とanimate()を使用してみてください：

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

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

表示するには：$('span').fadeTo(1000,1)

非表示にするには：$('span').fadeTo(1000,0)

スペースはDOMレイアウトで保持されます

http://jsfiddle.net/VZwq6/

10
user

代わりにfadeTo（duration、value）を使用しますか？確かにこの方法で0と1にフェードすることができ、そのようにしてドキュメントフローに影響を与えません...

1
Neil

非表示の要素のマッチングを試してみますか？

$（ "。littleme：hidden"）。fadeIn（）;

0
iivel