0

スクローラーとコンテンツフェーダーの2つのスクリプトを組み合わせています。コンテンツを入れ替える（フェード）と、コンテンツの多いdivを使用すると、スクロールするdivが非常に長くなります。さまざまなコンテンツをロードしてdivを適宜調整するときに使用できるコンテンツスクロールのプラグインデモ（http://manos.malihu.gr/jquery-custom-content-scroller ）を読んでいました。$(selector).mCustomScrollbar("update");

コードをフェードスクリプトのどこかに配置する必要があることはわかっていますが、どこにあるのでしょうか。これがフェージングスクリプトです、どこに行きますか？

<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){
(function($) {
    $.fn.Fader = function() {
        this.each(function() {
            $('.clickme').bind('click', function(e) {
                e.preventDefault();
                $( "#mediaswap div" ).fadeOut();
                $( "#mediaswap div" + $(this).attr('name') ).fadeIn();
            })
        });
    }
})(jQuery);


$(function() {
    $('#mediaswap').Fader();
});
});//]]>  

</script>
4

2 に答える 2

4

投稿のコメントに返信しましたが、ここにも書きます。

div をフェードイン/フェードアウトするため、 update メソッドを .fadeIn() 関数へのコールバックとして呼び出す必要があるため、アニメーションが完了した後にスクロールバーを更新します。

$( "#mediaswap div" + $(this).attr('name') ).fadeIn(function(){
    $(this).mCustomScrollbar("update");
});

さらに、最初にプラグインを呼び出すときに使用できる追加のオプション パラメータがあります。これは、コンテンツのサイズをチェックし、スクロールバーが変更された場合は自動的に更新します。

$("#mediaswap div").mCustomScrollbar({
    advanced:{ updateOnContentResize:true }
});

updateOnContentResize オプションの使用は、コードの残りの部分 (プラグインを呼び出す場所) に依存するため、最初の方法を使用することをお勧めします。

于 2012-07-27T17:05:28.343 に答える
0

div をチェックして、次のようなものを使用してアニメーション化されているかどうかを確認することをお勧めします。

var wait = setInterval(function() {
        if( !$("#mediaswap div").is(":animated")) 
        {
                clearInterval(wait);
                //put the code in here because it checks 
                  for whether the DIV is currently animated.
            }
        }, 200);

アニメーションが完了するまでに時間がかかる場合は、間隔を変更できます。

于 2012-07-26T16:57:44.470 に答える