web-dev-qa-db-ja.com

jQueryスクロールページの下へ

私のページがロードされた後。私はjQUeryがページの一番下までうまくスクロールし、素早く動くのではなく、スナップ/衝撃ではないことを望みます。

そのためにはScrollToのようなプラグインが必要ですか?それともjQueryに組み込まれているのでしょうか。

173
AnApprentice

scrollTopプロパティをアニメートすることでページをスクロールダウンするだけでアニメートできます。プラグインは不要です。

$(window).load(function() {
  $("html, body").animate({ scrollTop: $(document).height() }, 1000);
});

window.onloadではなくdocument.ready(高さを占める画像がロードされるとき)の使用に注意してください。

技術的に正しくするためには、ウィンドウの高さを引く必要がありますが、上記はうまくいきます。

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

特定のIDにスクロールするには、次のようにその .scrollTop() を使用します。

$("html, body").animate({ scrollTop: $("#myID").scrollTop() }, 1000);
375
Nick Craver

このようなもの:

var $target = $('html,body'); 
$target.animate({scrollTop: $target.height()}, 1000);
19
Josiah Ruddell
$('html,body').animate({ scrollTop: 9999 }, 'slow');

これと同じくらい単純で、9999ページの高さ...大きな範囲なので、一番下まで到達できます。

13
Alin Razvan

あなたはこれを試すことができます

var scroll=$('#scroll');
scroll.animate({scrollTop: scroll.prop("scrollHeight")});
9
Sarath Ak
$("div").scrollTop(1000);

私のために働きます。一番下までスクロールします。

8
f123

'document.body.clientHeight'を使うとbody要素の見かけの高さを取得できます

$('html, body').animate({
    scrollTop: $("#particularDivision").offset().top - document.body.clientHeight + $("#particularDivision").height()
}, 1000);

これはID 'specificDivision'でスクロールします

3
Anbu

次のような、以前の回答で述べたスクリプト

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

Chromeではは動作せず、SafariではジャンプしますCSShtmlタグにoverflow: auto;プロパティが設定されている場合把握するのに1時間近くかかりました。

2
Ilia Rostovtsev

JQuery 3の場合は、変更してください

$(ウィンドウ).load(function(){$( "html、body")。animate({scrollTop:$(document).height()}、1000);})

に:

$(ウィンドウ).on( "load"、関数(e){$( "html、body")。animate({scrollTop:$(document).height()}、1000);})

1
Adnan Tahir

js

var el = document.getElementById("el");
el.scrollTop = el.scrollHeight - el.scrollTop;
0
codeskyblue
$('#pagedwn').bind("click", function () {
        $('html, body').animate({ scrollTop:3031 },"fast");
        return false;
});

この解決策は私のために働きました。それはPage Scroll Downで速く働いています。

0