jquery - Bootstrap 导航栏切换按钮隐藏在移动设备上直到滚动(iOS)

标签 jquery ios twitter-bootstrap safari navbar

我在使用小型设备上的 iOS (Safari) 中的 Bootstrap 导航栏切换按钮时遇到了一些问题。一切都在其他浏览器中正常运行,即使在手机和平​​板电脑等小型设备上也是如此。

当页面加载时,切换按钮会隐藏,直到我滚动页面。在菜单中导航了几​​个链接后,一切似乎都正常工作。看起来它只是在最初不起作用。

我没有特殊的 CSS 或任何东西,只有一个带有 navbar-fixed-top 类的导航栏。

<div class="navbar navbar-inverse navbar-fixed-top">
        <div class="container fluid">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a href="/" class="navbar-brand"></a>
        </div>
        <div class="navbar-collapse collapse">
            <ul id="nav-main" class="nav navbar-nav navbar-left">
                <li id="startlnk"><a class="startlnk" href="#start" data-toggle="collapse" data-target=".navbar-collapse.in">Start</a></li>
                <li id="aboutuslnk"><a href="#aboutus" data-toggle="collapse" data-target=".navbar-collapse.in">Om os</a></li>
                <li id="meetuslnk"><a href="#meetus" data-toggle="collapse" data-target=".navbar-collapse.in">Medarbejdere</a></li>
                <li id="productslnk"><a href="#products" data-toggle="collapse" data-target=".navbar-collapse.in">Produkter</a></li>
                <li id="priceslnk"><a href="#prices" data-toggle="collapse" data-target=".navbar-collapse.in">Priser</a></li>
                <li id="footerlnk"><a href="#footer" data-toggle="collapse" data-target=".navbar-collapse.in">Kontakt</a></li>
                <li style="color:#fff;"><i class="fa fa-phone"></i>Telefon: 75 72 62 52</li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li class="facebook">
                    <a target="_blank" href="https://www.facebook.com/chamelloungevejle?fref=ts"><i class="fa fa-facebook-square fa-lg facebook-blue"></i></a>
                </li>
            </ul>
        </div>
    </div>
</div>

有谁知道为什么切换按钮在 iOS 设备上的 Safari 中表现如此?

最佳答案

我终于找到了导致导航栏崩溃的原因!

就是这个 css 文件 https://github.com/daneden/animate.css

我或多或少地一次禁用了所有的东西,在 iOS 的 Safari 上上传和测试。

关于jquery - Bootstrap 导航栏切换按钮隐藏在移动设备上直到滚动(iOS),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32296059/

相关文章:

javascript - 尝试使用 Chart.js 设置刻度刻度 beginAtZero 不成功,为什么?

ios - 是否关闭 View Controller 调用 ViewController 的析构函数

ios - 解析用户配置文件的查询配置文件数据 - Swift

iphone - 为视网膜 iPhone 开发应用程序/游戏

html - 无法在全宽上定义我的网站 - bootstrap

html - Bootstrap 4列对齐问题

javascript - 使用 jQuery 触发 oninput 事件

javascript - HTML5 视频 - 如何检测视频的特定部分何时加载

javascript - 如何在 jQuery 中访问当前 DOM 对象(改进代码)

html - Bootstrap 中的全宽定位?