0

私はこれに「チェーンイン」（追加）と追加機能を試みています：

元のコード、それはScrollToプラグインをアクティブにします：

$('a.scroll').live('click',function(){   
   $.scrollTo(this.hash+"_", 3333, {easing:'easeOutCubic'} ); 
   window.location.hash = this.hash;
   return false;
});

私が欲しいのは、ページがスムーズスクロールしている間に、divオーバーレイをフェードインし、画面に数秒間留まってから、フェードアウトしてスムーズスクロールが終了する直前に自分自身を削除することです。

通常のページ読み込みで#preloaderと呼ばれるこのdivオーバーレイをすでに使用していますが、scrollToアクション中にも使用したいと思います。（これは、css3の「読み込み中」のアニメーションが含まれる固定オーバーレイdivです。）

これは、これまでに試したことの例です。これを「チェーン」してみてください。

$('a.scroll').live('click',function(){   
    $.scrollTo(this.hash+"_", 3333, {easing:'easeOutCubic'} ); 
        $('#preloader').fadeIn(1234,function(){  // overlay div
            $(this).delay(1234).remove(); 
        });
    window.location.hash = this.hash;
    return false;
});

これでは何も起こりません。ScrollToは引き続き機能しますが、オーバーレイは表示されません。

これを正しい方法でチェーンするにはどうすればよいですか？フェードインする必要があり、設定された遅延の後、フェードアウトします。あなたの助けに感謝します私はjqueryでかなり役に立たないです。

4

1 に答える 1

0

私はそれを機能させることができなかったので、別の効果で行きました:

$('a.scroll').live('click',function(){  
    $('body').fadeTo('slow', 0.3);
    $.scrollTo(this.hash+"_", 3333, {easing:'easeInOutExpo'}); 
    window.location.hash = this.hash;
    $('body').fadeTo('slow', 1.0);
    return false;
});

これを使用すると、ScrollTo がよりスムーズに感じられます (びくびくしたり、滑らかでなくなったりすることが少なくなります)。スムーズ スクロールが発生する前に、本文の不透明度は 0.3 に縮小され、scrollTo アニメーションが完了すると、ページ コンテンツは通常の不透明度 1.0 にフェード インします。

これは私が最初に望んでいたものではありませんが、scrollTo を使用したときに滑らかさを増したように見せる役割を果たします。

于 2012-10-19T08:23:14.983 に答える