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

Jquery 如何使溢出:自动容器跟随列表项迭代,jquery,scrollbar,iteration,listitem,Jquery,Scrollbar,Iteration,Listitem,我将一个div容器设置为溢出:auto,其中包含许多。我编写了一个简单的函数,用于在用户单击按钮或按下向上或向下箭头时更改突出显示的列表项 唯一的问题是,当用户单击“迭代”按钮时,高亮显示的列表项将迭代,而后面没有容器滚动条。我正在寻找一种方法来强制容器滚动条随迭代滚动 下面是我尝试做的一个例子: 记住-上下箭头使容器滚动(只要容器有焦点),但迭代按钮不会 重要-我正在寻找.scrollTo()的替代方法要以编程方式执行此操作,您需要获取项目的高度和框的高度 滚动时间:(框的高度-(突出显示的

我将一个div容器设置为
溢出:auto
,其中包含许多
  • 。我编写了一个简单的函数,用于在用户单击按钮或按下向上或向下箭头时更改突出显示的列表项

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

    下面是我尝试做的一个例子:

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


    重要-我正在寻找.scrollTo()的替代方法

    要以编程方式执行此操作,您需要获取项目的高度和框的高度

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

    我希望这有帮助

    ::编辑::
    仅当框高度正好是指定数量的列表项的大小时,此操作才有效。假设每个项目的高度为20px,您希望列表框显示10个项目,那么您需要将列表框的高度设置为200px。

    怎么样?

    怎么样?怎么样?++Andy-我见过的最好的解决方案。这就是感谢@安迪,如果你把你的评论作为回答,我会接受的it@sadmicrowave,好的,谢谢!很高兴我能帮忙!考虑到这一点,你能看看这个并告诉我为什么。offset()。top一直在跳吗?Aelux-虽然我的容器始终是指定的高度,但我的容器中会有未知数量的列表项。列表中有多少项并不重要,只要列表框的大小与您一次可以查看的列表项的大小成比例。就你的第一个评论而言,你的补偿需要使用我上面解释的公式,才能起作用。您需要将项目的高度添加到偏移量中,而不是将其设置为相等。但是请记住,您只需要在上面提到的算法低于零时滚动。最后使用scrollIntoView()它非常干净,似乎可以按要求工作。谢谢