jQueryアニメーション効果のanimateとscrollTopを一緒に使用する例_jquery

CSS プロパティ値は徐々に変化し、アニメーション効果を作成できます。
アニメーション化できるのは数値のみです (例: 「margin:30px」)。
文字列値はアニメーション化できません (「background-color:red」など)。

コードをコピー コードは次のとおりです。

$('#shang').click(function( ){$ ('html,body').animate({scrollTop: '0px'}, 800);});

上記のコードは、スクロール バーが 0 の位置にジャンプし、ページが移動することを示しています。移動速度は800。
scrollTop を組み合わせた実際の例:

コードをコピー コードは次のとおりです:

jQuery (ドキュメント) .ready(function($){
$('#shang').click(function(){
$('html,body').animate({scrollTop: '0px'}, 800);
});
$('#comt').click(function(){
$('html,body').animate({scrollTop:$('#comments') .offset( ).top}, 800);
});
$('#xia').click(function(){
$('html,body').animate({scrollTop :$( '#footer').offset().top}, 800);
});
});

は、関連する ID をクリックして指定された位置に移動することを意味します。
ID が shang の要素をクリックすると、先頭に戻ります。
ID が comt の要素をクリックすると、ID コメントの位置に戻ります。
ID が xia の要素をクリックすると、一番下に戻ります。 >