javascript - アニメーション化された JavaScript scrollBy

Question

クリックするとページ517pxを下にスクロールする次のボタンがあります。

次のコード (別のサイトで見つけたもの) を使用して、それを行うボタンを作成しましたが、スムーズにアニメーション化された方法でスクロールしたいと考えています。そのためには何を追加する必要がありますか？

私が使用しているコードは次のとおりです。

function scrollByPixels(x, y)
{
  window.scrollBy(x, y);
}

実際のボタンでは次のようになります。

onclick="javascript:scrollByPixels(0, 517)"

前もって感謝します

score 2 · Accepted Answer

function scrollByPixels(x, y) {
  $('html,body').stop().animate({
    scrollLeft: '+=' + x,
    scrollTop: '+=' + y
  });
}

...または単純なプラグインとして:

$.fn.scrollBy = function(x, y){
    return this.animate({
        scrollLeft: '+=' + x,
        scrollTop: '+=' + y
    });
};

score 1 · Accepted Answer

ウィンドウ全体をスクロールするには:

var value = $("#scrollToHere").offset().top;

$('html, body').animate({
        scrollTop: value
    }, 800);

3 に答える 3