Bootstrap scrollspy 导航在固定导航栏中不起作用

Question

我在这里使用 bootstrap 导航：https://bm-translations.de/km

我将以下内容设置为 official manual，以根据滚动位置自动更新 Bootstrap 导航或列出组组件，以指示哪个 link 当前在视口中处于活动状态。但它不起作用：

body {
  position: relative;
}

<body data-spy="scroll" data-target="#myNavbar">

为什么这不起作用？我做错了什么？

Answer 1

问题是导航链接中的绝对 urls。它们应该只包含散列而不是完整的 url..

<a itemprop="url" href="#video">

如果您必须使用绝对url，您可以在data-target中指定Scrollspy锚...

<ul class="nav navbar-nav">
    <li class="" itemprop="name"><a itemprop="url" href="https://bm-translations.de/km#video" data-target="#video">Leistungen</a>
        <ul>
            ..
        </ul>
    </li>
    <li itemprop="name" class="active"><a itemprop="url" href="https://bm-translations.de/km#ueber-mich" data-target="#ueber-mich">Über mich</a>
    </li>
    <li itemprop="name" class=""><a itemprop="url" href="https://bm-translations.de/km#kosten" data-target="#kosten">Preise</a>
    </li>
    <li itemprop="name" class=""><a itemprop="url" href="https://bm-translations.de/km#kontakt" data-target="#kontakt">Kontakt</a></li>
</ul>

Bootstrap scrollspy 导航在固定导航栏中不起作用

Bootstrap scrollspy navigation not working in fixed navbar

navigation

twitter-bootstrap

scrollspy