简体   繁体   English

Bootstrap 3不会在移动设备或平板电脑上折叠导航栏

[英]Bootstrap 3 does not collapse navbar on mobile or tablet size

I'm trying to make the navbar collapsible but for some reason it collapse and close its self very fast. 我正在尝试使导航栏可折叠,但是由于某种原因它会折叠并非常快速地关闭自身。
Here is my code: 这是我的代码:

    <div class="navbar navbar-inverse navbar-static-top">
        <div class="container">
            <a href="#" class="navbar-brand">
                <img class="logo" src="../img/logo.png" /></a>
            <div class="navbar-header">
                <button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse">
                    <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
                </button>
            </div>
            <div class="collapse navbar-collapse navHeaderCollapse">
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="../Default.aspx">Home</a></li>
                    <li><a href="../Library/Library.aspx">Library</a></li>
                    <li><a href="../About.aspx">About</a></li>
                    <li><a href="#contact" data-toggle="modal">Contact</a></li>
                    <li>
                        <asp:LoginView ID="HeadLoginView" runat="server" EnableViewState="false">
                            <AnonymousTemplate>
                                <a href="#login" id="HeadLoginStatus" runat="server" data-toggle="modal">Log In</a>
                            </AnonymousTemplate>
                            <LoggedInTemplate>
                                <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Settings<span class="caret"></span></a>
                                    <ul class="dropdown-menu" role="menu">
                                        <li role="presentation" class="dropdown-header"><asp:LoginName ID="HeadLoginName" runat="server" /></li>
                                        <li><a href="#">Accounts</a></li>
                                        <li><a href="#"><asp:LoginStatus ID="HeadLoginStatus" runat="server" LogoutAction="Redirect" LogoutText="Log Out" LogoutPageUrl="~/" /></a></li>
                                    </ul>
                                </li>
                            </LoggedInTemplate>
                        </asp:LoginView>
                    </li>
                </ul>
            </div>
        </div>
    </div>

Can someone tell me whats the problem with it? 有人可以告诉我这是什么问题吗?

将您的“按钮”更改为“ div”标签,这将防止发回邮件。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM