我的设置比bootstrap演示稍微复杂一些。我的导航栏位于首屏下方。一旦导航栏滚动到位,我就会通过jquery添加'navbar-fixed-top'类。它在桌面上运行得很漂亮。但是,它不适用于移动设备。
以下是导航栏滚动到位后的代码。不幸的是,导航栏并未保持固定状态。我错过了什么吗?
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="mobile-nav-expand"></span>
</button>
<a class="navbar-brand" href="/pagename.aspx"><img src="/img/my-logo.png" /></a>
<div class=" class="clearfix"></div>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav visible-sm visible-xs">
<li class="text-center mobile"><a href="/pagename.aspx">link</a></li>
<li class="text-center mobile"><a href="/pagename.aspx">link</a></li>
<li class="text-center mobile"><a href="/pagename.aspx">link</a></li>
<li class="text-center mobile"><a href="/pagename.aspx">link</a></li>
<li class="text-center mobile"><a href="/pagename.aspx">link</a></li>
<li class="text-center mobile"><a href="/pagename.aspx">link</a></li>
<li class="text-center mobile">
<br />
<b>ADDRESS</b><br />
Street<br />
City, State 12345</span>
</li>
</ul>
<ul class="nav navbar-nav navbar-right hidden-xs">
<li class="dropdown">
<a class="dropdown-toggle disabled" data-toggle="dropdown" href="/pagename.aspx">link <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="/directory/pagename.aspx">link</a></li>
<li><a href="/directory/pagename.aspx">link</a></li>
</ul>
</li>
<li><a href="/pagename.aspx">link</a></li>
<li><a href="/pagename.aspx">link</a></li>
<li><a href="/pagename.aspx">link</a></li>
<li><a href="/pagename.aspx">link</a></li>
<li><a href="/pagename.aspx">link</a></li>
</ul>
</div>
</div>
</div>