jquery - Bootstrap Scrollspy 不正确的突出显示

Question

我有一个集成了 Bootstrap ScrollSpy 的 WordPress 网站。当您滚动时，Scrollspy 会被激活，但它会在导航栏中错误地突出显示前两项。由于第一个内容框比其他内容框大，似乎存在偏移问题，但我在 body 标记中并通过 jQuery('.navbar').scrollspy() 添加了偏移量。我还添加了padding-top: 100px到页面上的第一个内容框。这些解决方案都不起作用。我在这里缺少什么？

The working page

Answer 1

默认情况下，ScrollSpy 绑定(bind)到具有数据属性 data-spy="scroll" 的元素(在本例中为 body 元素) ，但由于准备就绪后有许多图像和内容正在加载，因此事件已被触发。

我建议使用javascript api的滚动 spy 刷新使用刷新方法计算的偏移量和目标，如下面的代码所示:

<script type="text/javascript">
jQuery(document).ready(function() {
    setTimeout(updateScrollSpy, 1000);
});
function updateScrollSpy() {
    jQuery('[data-spy="scroll"]').each(function () {
      var $spy = jQuery(this).scrollspy('refresh')
    });
}
</script>

此外，“Key Advantage”未提供内部 ID 链接，因此会重定向到给定的链接。