如何将可滚动div内的项目滚动到顶部

我有一个在页面中滚动的#contact-list-scroller div。 基于contact_XXXX ID，我希望＃contact-list-scroller滚动位置设置为下注以确保contact_XXX项目位于页面顶部。

 
stuff
 
stuff
 
stuff
 
stuff
 
stuff
 .....  

这是我到目前为止所拥有的：

 $('#contact-list-scroller').scrollTop($('#contact_' + id).scrollTop()); 

但这只是滚动到顶部。 想法？ 谢谢

Answer 1

我想你需要position（） 。top。 因为position（）返回的值是相对于其父级的（与offset（）不同），所以它使代码更加灵活。 如果更改父容器的位置，则代码不会中断。

例：

 var contactTopPosition = $("#contact_8967").position().top; $("#contact-list-scroller").scrollTop(contactTopPosition); 

或动画：

 $("#contact-list-scroller").animate({scrollTop: contactTopPosition}); 

见jsfiddle： http ： //jsfiddle.net/5zf9s/

Answer 2

即使我有相同的情况，并希望滚动元素到顶部。 现在，直接支持这种行为。

只需使用.scrollIntoView(true) JavaScript方法。

---

例：

document.getElementById("yourElementId").scrollIntoView(true);

---

更多信息：

虽然现在是实验性的，但很快就会得到每个浏览器的支持。 您可以在以下位置找到更多相关信息： MDN

Answer 3

 var scrollTop = $('#contact_' + id).offset().top; $('#contact-list-scroller').attr('scrollTop', scrollTop); 

jsFiddle 。

Answer 4

看一下jquery scrollTo插件 – 你可以用它来滚动到一个特定的DOM元素http://flesler.blogspot.com/2007/10/jqueryscrollto.html

Answer 5

在完成上述所有操作后，我没有成功，我在W3schools找到了这个：

 var elmnt = document.getElementById("Top"); elmnt.scrollIntoView();