Question

这是我的第一个没有CMS的网站，我很少迷失jQuery。我只是想根据用户所在的位置激活固定导航栏的元素。我正在使用bootstrap构建我的站点，这就是我使用scrollspy函数的原因。如果有人能帮助我以其他方式做到这一点会很棒。我用html，css和jquery代码创建了一个小提琴 here我也在这里写下代码。提前谢谢。

<body data-spy="scroll" data-target="#top-menu">
<div>
<ul id="top-menu" style="background: green;">
<li><a class="active" href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#portfolio">Portfolio</a></li>
</ul>
</div>
<br><br>

<div id="home">
<p>This is home section</p>
</div>
<div id="about">
<p>About</p>
</div>
<div id="portfolio">
<p>This is the portfolio</p>
</div>
</body>

jquery是here

Answer 1

您应该为代码中的ul元素添加“nav”类，并为列表的父div元素的数据目标值id设置。

Smth喜欢以下代码：

<body data-spy="scroll" data-target="#top-menu">
    <div id="top-menu">
    <ul style="background: green;" class="nav">
    <li><a class="active" href="#">Home</a></li>
    <li><a href="#about">About</a></li>
    <li><a href="#portfolio">Portfolio</a></li>
    </ul>
    </div>
    <br><br>

    <div id="home">
    <p>This is home section</p>
    </div>
    <div id="about">
    <p>About</p>
    </div>
    <div id="portfolio">
    <p>This is the portfolio</p>
    </div>
</body>

如何使用非bootstrap导航栏的bootstrap的scrollspy函数

1 个答案: