Question

我似乎无法弄清楚为什么sticky-top功能不起作用。我通过写一些看起来很恐怖的javascript代码解决了这个问题，但希望有人可能有个主意。我只希望它停留在屏幕顶部，当我以50px滚动到页面上的其他元素时。

导航栏的外观和功能符合预期（如图所示），但这可能是PEBCAK的情况...

 <body data-spy="scroll" data-target=".navbar" data-offset="50">
     
<nav class="navbar navbar-default navbar-fixed-top" id="secondNav">
  <div class="container-fluid">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>                        
      </button>
      <a class="navbar-brand" href="#">Portfolio</a>
    </div>
    <div>
      <div class="collapse navbar-collapse" id="myNavbar">
        <ul class="nav navbar-nav navbar-right">
          <li><a href="#section1">Section 1</a></li>
          <li><a href="#section2">Section 2</a></li>
          <li><a href="#section3">Section 3</a></li>
          <li><a href="#section4">Section 4</a></li>
        </ul>
      </div>
    </div>
  </div>
</nav>

Answer 1

尝试使用navbar-fixed-top而不是使用fixed-top。让我知道是否有帮助。

粘顶功能不适用于引导导航栏

1 个答案: