Javascript 设置滚动条位置
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3562202/
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
Setting a scrollbar position
提问by Scrollbar
I have a table inside of a div (it's overflow, so the browser renders a scrollbar). Using JavaScript, how do I move the scrollbar handle along the track to a position that corresponds to the location of a row in the table?
我在 div 中有一个表（它溢出了，所以浏览器会呈现一个滚动条）。使用 JavaScript，如何将滚动条手柄沿轨道移动到与表中行的位置相对应的位置？
+--------------------------------------+
|100 | |
|101 | |
|102 | |
|103 | |
|104 | |
|105 This is a table that |---|
|106 has overflowed. | - | <-- I want to move this using JavaScript,
|107 |---| so that a specific row # is visible.
|108 | |
|109 | |
|110 | |
|111 | |
+--------------------------------------+
回答by Dan Herbert
If you want to go the non-jQuery way, use the containing table's scrollTopproperty.
如果您想采用非jQuery 方式，请使用包含表的scrollTop属性。
Lets assume you can easily identify the row you want to scroll to using an ID, along with the containing <div />. Use the offsetTopof the element you want to scroll to.
假设您可以使用 ID 以及包含<div />. 使用offsetTop要滚动到的元素的 。
var container = document.getElementById('myContainingDiv');
var rowToScrollTo = document.getElementById('myRow');
container.scrollTop = rowToScrollTo.offsetTop;
回答by Hessam Nadr
You can use this:
你可以使用这个：
$('a').on('click', function(e){
var t = this.id.substring(1);
e.preventDefault();
var target= $(".section")[t] ;
var offset = $( target ).offset();
$('html, body').stop().animate({
scrollTop: offset.top
}, 1000);
});
Also, you could check this example on jsfiddle .
此外，您可以在 jsfiddle 上查看此示例。
回答by Aravind T
Using Jquery:
使用jQuery：
'.scroll-table' is the class name used for scroll-able part
'.scroll-table' 是用于可滚动部分的类名
1.First go to the initial position
1.先到初始位置
$('.scroll-table').scrollTop(0);
2.Below line calculates the scroll difference between the tables top position and the row to which we have scroll
2.Below line 计算表格顶部位置和我们滚动到的行之间的滚动差异
$('.scroll-table').scrollTop($('#myrowid').position().top-$('.scroll-table').position().top);
回答by Nuno Ribeiro
If you are interested in jQuery here, you can do it as follows:
如果您对 jQuery 感兴趣，可以按如下方式进行：
$(".tableClass tbody").scrollTop(0);
回答by Gustavo Lage
There is a solution using AngularJs.
有一个使用 AngularJs 的解决方案。
$document.scrollTopAnimated(50, 1000).then(function () {});
The first parameter is the position. The second is the duration of animation.
第一个参数是位置。第二是动画的持续时间。
回答by Santiago Rebella
You can also use the .scrollTop()jQuery method:
您还可以使用.scrollTop()jQuery 方法：
