如何使溢出:自动容器跟随列表项迭代



我有一个div容器设置为overflow:auto,其中包含许多<li>。我写了一个简单的函数来更改当用户单击按钮或按向上或向下箭头时突出显示的列表项。

唯一的问题是,当用户单击迭代按钮时,突出显示的列表项会迭代,而后面没有容器滚动条。我正在寻找一种方法来强制容器滚动条滚动与迭代

下面是我要做的一个例子:http://jsfiddle.net/sadmicrowave/rwfUr/

记住-上下箭头使容器滚动(只要容器有焦点),但迭代按钮不。

重要的 -我正在寻找替代。scrollto ()

.scrollIntoView()呢?

要以编程方式做到这一点,您需要获得项目的高度和框的高度。

何时滚动:(box的高度-(突出显示的项目编号*项目高度)<0) 使用scrollTop属性按项目的高度滚动列表,而上面的内容小于0。

我希望这对你有帮助。

:: Edit::只有当框的高度正好是指定数量的列表项的大小时,这才会起作用。假设每个项目的高度是20px,你希望列表框显示10个项目,那么你需要将列表框的高度设置为200px。

最新更新