12

ページ内の特定のセクション (ハッシュタグを使用) にリンクするアンカーと、ドキュメント ウィンドウの上部または下部にスクロールするアンカーがいくつかあります。

$("html, body").animate({ scrollTop: $(document).height() }, 2000);

ただし、アニメーションとスクロールが目的の場所に到達して完了するとすぐに、ドキュメントのスクロールとスクロールバーが数秒間無効になっているように見えます。たとえば、[ページの下部に移動] リンクをクリックすると、ドキュメント ウィンドウがページの下部まで正しくスクロールされます。上にスクロールしようとするとすぐに、ぎくしゃくした動きで少し上下に揺れ、後で数回スクロールできるようになります。

これを引き起こしている可能性のあるヒントはありますか？

4

3 に答える 3

21

このスレッドは古いですが、私はこれに遭遇し、どこにも答えがありませんが、ここに解決策があります:

$(window).bind("mousewheel", function() {
    $("html, body").stop();
});

アニメーションの実行中にユーザーがスクロールバーを使用すると、アニメーションが停止します。

于 2013-06-03T14:46:28.923 に答える
7

Scotty の回答に貢献するために、実際には .stop() メソッドにclearQueueとjumpToEndという 2 つのオプションを追加することもできます。

スクロールの問題に遭遇し、スコッティが提案した .stop() を最初に使用しましたが、アニメーションがまだ「苦労して」終了していることに気付きました。ここでドキュメントをチェックアウトしました: .stop() Method Documentation

追加することで、.stop(true, false);次のことができました。

1.) キューに入れられたアニメーションを削除します (複数のアニメーションがトリガー/カスケードされた場合に備えて)

2.) アニメーションが終了値にジャンプしないようにします。

他の誰かがキーボードに頭をぶつけているのを助けることを願っています;）

于 2016-01-30T21:19:49.353 に答える