jQueryを使用してページ上の特定の場所までスクロールするにはどうすればいいですか? 質問する

Question

jQuery スクロールプラグイン

これはタグ付きの質問なのでjQueryのこのライブラリにはスムーズなスクロールのための非常に優れたプラグインがあり、ここから見つけることができます:http://plugins.jquery.com/scrollTo/

ドキュメントからの抜粋:

$('div.pane').scrollTo(...);//all divs w/class pane

または

$.scrollTo(...);//the plugin will take care of this

スクロール用のカスタム jQuery 関数

非常に軽量アプローチカスタムスクロールjQuery関数を定義することによって

$.fn.scrollView = function () {
    return this.each(function () {
        $('html, body').animate({
            scrollTop: $(this).offset().top
        }, 1000);
    });
}

次のように使用します:

$('#your-div').scrollView();

ページ座標までスクロール

または属性を持つ要素htmlをアニメーション化するbodyscrollTopscrollLeft

$('html, body').animate({
    scrollTop: 0,
    scrollLeft: 300
}, 1000);

プレーンなJavaScript

スクロールしてwindow.scroll

window.scroll(horizontalOffset, verticalOffset);

要約すると、IDを持つ要素にジャンプするにはwindow.location.hashを使用します

window.location.hash = '#your-page-element';

HTML で直接 (アクセシビリティの強化)

<a href="#your-page-element">Jump to ID</a>

<div id="your-page-element">
    will jump here
</div>

Answer 1