web-dev-qa-db-ja.com

jQueryを使用してdivの上部にスクロールする方法は？

Div内にgridviewがあります。jqueryを使用して、divの下部からdivの上部にスクロールします。

<div id="GridDiv">
// gridview inside..
</div>

グリッドビューには、カスタムページネーションで生成されたリンクボタンがあります...リンクボタンのクリックの下部からdivの上部にスクロールします...

protected void Nav_OnClick(object sender, CommandEventArgs e)
    {
        LinkButton lb1 = (LinkButton)sender;
        //string s = lb1.ID;
        ScriptManager.RegisterClientScriptBlock(lb1, typeof(LinkButton), 
 "scroll", "javascript:document.getElementById('GridDiv').scrollTop = 0;", true);

Javascriptの代わりに、jquery関数を呼び出します...任意の提案...

編集：

ユーザーページごとのStackoverflowの質問とまったく同じです...ページ番号を変更すると、スムーズな効果で上にスクロールします...私はそれを達成したいです...

jqueryhtmlscrollscrolltop
47
ACP

あなただけを使用することができます：

<div id="GridDiv">
// gridview inside...
</div>

<a href="#GridDiv">Scroll to top</a>
4
Ates Goral

Jqueryを使用してできることは次のとおりです。

$('#A_ID').click(function (e) { //#A_ID is an example. Use the id of your Anchor
    $('html, body').animate({
        scrollTop: $('#DIV_ID').offset().top - 20 //#DIV_ID is an example. Use the id of your destination on the page
    }, 'slow');
});
171
Greg Mathews

または、コードを少なくするために、クリック内に以下を配置します。

setTimeout(function(){ 

$('#DIV_ID').scrollTop(0);

}, 500);
38
M.Bush

理由はわかりませんが、少なくとも200ミリ秒のsetTimeoutを追加する必要があります。

setTimeout( function() {$("#DIV_ID").scrollTop(0)}, 200 );

Firefoxでテスト済み/ Chrome/Edge。

1
London Smith

Stoicに感謝します

   $("#miscCategory").animate({scrollTop: $("#miscCategory").offset().top});
1
RationalRabbit

次の機能を使用します

window.scrollTo(xpos, ypos)

ここでxposは必須です。 x軸（水平）に沿ったスクロールする座標（ピクセル単位）

yposも必須です。 y軸（垂直）に沿った、スクロールする座標（ピクセル単位）

0
Shoaib Quraishi