DIV 中的长 UL 列表，自动滚动到 LI 元素

Question

我有一个非常奇怪的问题，我有一个

元素

。

_inputHelper // it has fixed height ( 200px )

我想用jQuery滚动一个非常长的<ul>列表（约200个元素），并定位到列表中的某些<li>，但问题是，当我通过滚动整个列表实现这个目标时：

$( _inputHelper.find('ul') ).animate( { top : -1 * ( $(_this).position().top - $(_this).height() ) } , 200);

_this is a LI element I would like to scroll to

页面已经往下滚动到了合适的位置，但我无法使用鼠标滚动列表，这里是更加精确的截图:

我认为我可能在错误的方式中滚动，但我也尝试了scrollTop/margin-top，它仍然不起作用。

一些测试：http://jsfiddle.net/uk5xqfry/3/

有什么帮助吗？

- kuba

---

请使用 scrollTop 代替 top ... 您能分享代码标记或在 jsfiddle 上编写一个例子吗？ - DaniP

抱歉，我打错了，我是指scrollTop，而不是scrollTo :) 我会尝试做一些jsfiddle。 - kuba

http://jsfiddle.net/uk5xqfry/3/ 给你 :) - kuba

Answer 1

根据您的Fiddle代码，您需要使用scrollTop，请尝试以下方法：

$('.input-helper').animate({
    scrollTop : $("#test").position().top,
}, 200);

请查看示例演示代码。

---

在您的代码中，您只是移动了 ul 元素，然后它超出了父级视图范围; 现在使用此代码更改父级滚动。

- DaniP

---

好的，所以我必须滚动div本身，而不是ul列表 :) 谢谢，今天编码太多了;-) - kuba

Answer 2

我记得几年前遇到过这个问题（滚动内部元素到某一点，而不是滚动视口到一个元素），我当时使用了一个jQuery插件来解决它。这让事情变得简单。

https://github.com/flesler/jquery.scrollTo

- Jason