jQuery 如何使用jQuery滚动到div的顶部？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2369081/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to scroll to top of a div using jQuery?
提问by ACP
I have a gridview inside a div.. I want to scroll to top of the div from the bottom of the div using jquery.. Any suggestion..
我在 div 中有一个 gridview .. 我想使用 jquery 从 div 底部滚动到 div 顶部 .. 任何建议..
<div id="GridDiv">
// gridview inside..
</div>
My gridview will have custom pagination generated link buttons in it... I will scroll to top of the div from the bottom of the link button click ...
我的 gridview 将在其中包含自定义分页生成的链接按钮...我将从链接按钮的底部滚动到 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);
In the place of javascript, I ll call the jquery function... Any suggestion...
代替 javascript，我将调用 jquery 函数...任何建议...
EDIT:
编辑：
Exactly like Stackoverflow questions per user page... When changing page nos it scrolls to top with smooth effect... I want to achieve that...
就像每个用户页面的 Stackoverflow 问题一样......当更改页面编号时，它会以平滑的效果滚动到顶部......我想实现这一点......
采纳答案by Ates Goral
You could just use:
你可以只使用：
<div id="GridDiv">
// gridview inside...
</div>
<a href="#GridDiv">Scroll to top</a>
回答by Greg Mathews
Here is what you can do using jquery:
以下是您可以使用 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');
});
回答by M.Bush
Or, for less code, inside your click you place:
或者，对于更少的代码，在您的点击中放置：
setTimeout(function(){
$('#DIV_ID').scrollTop(0);
}, 500);
回答by RationalRabbit
Special thanks to Stoic for
特别感谢 Stoic
$("#miscCategory").animate({scrollTop: $("#miscCategory").offset().top});
回答by London Smith
I don't know why but you have to add a setTimeout with at least for me 200ms:
我不知道为什么，但您必须为我添加至少 200 毫秒的 setTimeout：
setTimeout( function() {$("#DIV_ID").scrollTop(0)}, 200 );
Tested with Firefox / Chrome / Edge.
使用 Firefox / Chrome / Edge 进行测试。
回答by Shoaib Quraishi
Use the following function
使用以下功能
window.scrollTo(xpos, ypos)
Here xpos is Required. The coordinate to scroll to, along the x-axis (horizontal), in pixels
这里 xpos 是必需的。沿 x 轴（水平）滚动到的坐标，以像素为单位
ypos is also Required. The coordinate to scroll to, along the y-axis (vertical), in pixels
ypos 也是必需的。沿 y 轴（垂直）滚动到的坐标，以像素为单位
回答by Ipsita Mallick
This is my solution to scroll to the top on a button click.
这是我单击按钮时滚动到顶部的解决方案。
$(".btn").click(function () {
if ($(this).text() == "Show options") {
$(".tabs").animate(
{
scrollTop: $(window).scrollTop(0)
},
"slow"
);
}
});
