更新

Question

我在网页上实现相对复杂的自动滚动功能时遇到问题。这会在我的代码中显示问题...

我的页面上有多个div（在我的示例中为蓝色，红色，绿色），我不仅希望能够滚动到（我的示例中的前三个按钮完美实现），但我希望能够滚动WITHIN（底部3个按钮代表我最好的尝试）。

我无法弄清楚的是，为什么函数内的滚动在我的第一个div（＆＃34; scrollTo3rdBlueItem＆＃34;按钮）上运行良好，但随后其他div（＆＃34）则不太准确; scrollTo3rdRedItem＆＃34;和＆＃34; scrollTo3rdGreenItem＆＃34; buttons）。在我的完整Web应用程序中（显然有更多数据需要滚动），我基本上看到父div位于页面下方的位置越低，我就越不能准确地在其中滚动。

我努力识别大部分模式，但不能简单地尝试调整偏移值。任何想法，我可能在这里做错了将非常感谢!!

...因为我不允许在不引用代码的情况下发布此内容 - 这是您在我的代码中可以看到的jquery函数！

function scrollToParent(parentID){
        $('html,body').animate({scrollTop: $('#'+parentID).offset().top}, 500);
 }
function scrollToChild(parentID, childID){
      //first focus on the parent
  scrollToParent(parentID);

      $('#'+parentID).animate(
        {scrollTop: $('#'+ childID).offset().top - 100}
        , 500);
}

Answer 1

更新

这里的答案是完全错误的。留在这里保留评论。

更新2

得到了它！您需要考虑父div的偏移量。将 scrollToChild 功能更新为以下内容;

  $('#'+parentID).animate(
    {
      scrollTop: $('#'+ childID).offset().top - $('#'+parentID).offset().top
    }, 500);

jquery animate / scrollTop到div中的多个锚点

1 个答案:

更新

更新2