Question

我试图使用scrollspy，并认为我做的一切都是正确的，但显然我没有...它实际上起初工作但是它已经有一段时间了，而且我已经有一段时间了。增加和减少堆，所以不知道是什么导致它。这是我的代码

<body id="home" data-spy="scroll" data-target="#primary-nav" data-offset="20">
    <nav class="navbar navbar-custom navbar-fixed-top" role="navigation" id="primary-nav">
        <div class = container> 
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#collapse">
                    <span class="sr-only">Toggle nav</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>  
                <a class="navbar-brand" href="#featured"><span class="logo">reflections</span></a>
            </div><!--navbar-header-->
        </div><!--container-->

        <div class="collapse navbar-collapse navbar-right">
            <ul class="nav navbar-nav">
                <li class="hidden">
                    <a href="#home"></a>
                </li>
                <li role="presentation">
                    <a href="#villa">OUR VILLA</a>
                </li>
                <li role="presentation">
                    <a href="#photos">PHOTOS</a> 
                </li>
                <li role="presentation">
                    <a href="#contact">CONTACT US</a>
                </li>
                <li role="presentation">
                    <a href="#location">OUR LOCATION</a>
                </li>
            </ul>
        </div><!---navbar-collapse--->
    </nav>

我真的很感激一些帮助。提前谢谢，

Answer 1

scrollspy工作得很好DWatson。将此样式属性添加到您的css：

.navbar-nav>li.active {
    background-color: green;
}

，滚动时会注意到颜色会相应变化。

Bootstrap Scrollspy停止工作

1 个答案: