ページをスクロールアップ - フェードアウト

Question

こんにちは、私は、複数のDIV要素付きのスライドショーを作成するために、次のコードを使用します。

var $ = jQuery.noConflict(); 
function fadeContent() { 
    $(".slideshow .asset-abstract:first").fadeIn(500).delay(2000).fadeOut(500, function() { 
    $(this).appendTo($(this).parent()); 
    fadeContent(); 
    }); 
} 
fadeContent(); 

スライドショーが正常に動作しますが、問題があります。 delay（2000）がfadeIn-fadeOutをトリガーすると、ページがスクロールアップします！

これを防ぐにはどうすればよいですか？

Answer 1

fadeOutメソッドは、要素のop設定display:none;を終了するためです。

あなたは、CSSで表示ブロックを強制した場合、これは発生しません。

のCss：

.slideshow .asset-abstract:first-child { 
    display:block; 
} 

Answer 2

私は要素がフェードアウトするとき、それはページ上の不動産を取らないと思います。その下にある要素がその位置をとり、ページがスクロールしたように感じます。あなたはfadeIn/fadeOutしようとしている要素へのラッパーを持つことができ、このラッパー要素に適切な高さを与えます。しかし、これは良いUXではありません。要素がfadeOutになると、ページに空のセクションがあるからです。