Bootstrap菜单在大多数移动设备上都不会保持开放状态

时间:2018-06-11 23:55:39

标签: jquery twitter-bootstrap mobile

我有一个网站,它大量使用bootstrap进行布局和响应。我正在使用带有jquery 3.3.1的bootstrap 4.1.1。我刚刚修改了一个网站并升级了我正在使用的模块版本。

一切都很好,除了在大多数移动设备上我的汉堡包菜单不会保持打开状态。它会打开并立即关闭,然后您可以单击选项。在PC上,一切都按预期工作。

我只有一些手机可供测试,但我在Android和iOS上得到这种行为...在Android上有趣,它不能在使用Chrome的Pixel 2 XL上工作但它适用于Nexus 6铬。

此行为在jquery 3.2.x和最新版本3.3.1中都有。我在Visual Studio中进行开发,因此菜单是使用我编辑过的默认值创建的,当与bootstraps自己的示例相比时,我几乎完全相同......当我改变以弥补差异时它并没有修复它

我可以在网上找到类似的问题,但每个人都会看到与某人修改脚本行为或添加课程的交易他们不应该......我还没有做到这一点我在哪里(例如"固定顶部")我尝试删除它们仍然得到相同的结果。 (我不是在修改javascript)。此外,我没有在旧网站的顶部构建更改,我从头开始创建了一个网站并重写了它。

我在课堂上做了1次更改,但是在旧版本的jquery和bootstrap版本的旧版本上工作正常。

.navbar {
    background: linear-gradient(#92A8B7, #285270);
}

我已经在下方发布了我的菜单HTML ...这是公开的,所以我可以提供有问题的实际网站的URL ...我不是百分之百确定在问题中发布链接的政策。< / p>

有人可以协助确定菜单一旦打开就会立即关闭的原因吗?

<nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top">
            <div class="container">
                <a class="navbar-brand" href="/">
                    <img src="/image/Logo_site_small.png" /></a>
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>

                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                    <ul class="navbar-nav mr-auto">
                        <li class="nav-item active"><a class='nav-link <%=IsSelected("default")%>' href="/" >Home <span class="sr-only">(current)</span></a></li>
                        <li class="nav-item"><a class="nav-link <%=IsSelected("media")%>" href="/media">Press / Media</a></li>
                        <li class="nav-item"><a class="nav-link <%=IsSelected("events")%>" href="/events">Events</a></li>
                        <li class="nav-item"><a class="nav-link <%=IsSelected("galleries")%>" href="/galleries">Photos</a></li>
                        <li class="nav-item"><a class="nav-link <%=IsSelected("buy")%>" href="/linkit.ashx?code=buyunit5comix" target="_blank">Buy</a></li>
                        <li class="nav-item"><a class="nav-link <%=IsSelected("About")%>" href="/about">About</a></li>
                        <li class="nav-item"><a class="nav-link <%=IsSelected("contact")%>" href="/contact">Contact</a></li>
                    </ul>
                    <asp:LoginView runat="server" ViewStateMode="Disabled">
                        <AnonymousTemplate>
                            <ul class="nav navbar-nav navbar-right" style="margin: 0; padding: 0;">
                                <li><a href="/linkit.ashx?code=u5facebook" style="padding: 0; margin: 0;" target="_blank">
                                    <img src="/image/facebook-e1417900370137.png" /></a></li>
                                <li><a href="/linkit.ashx?code=u5insta" style="padding: 0; margin: 0;" target="_blank">
                                    <img src="/image/INSTAGRAM-e1417900651282.png" /></a></li>
                                <li><a href="/linkit.ashx?code=u5twitter" style="padding: 0; margin: 0;" target="_blank">
                                    <img src="/image/twitter-e1417900317929.png" /></a></li>
                            </ul>
                        </AnonymousTemplate>

                    </asp:LoginView>
                </div>
            </div>
        </nav>

0 个答案:

没有答案