4
我正在使用自舉網站，並且在我的iphone和ipad上查看時遇到了導航欄切換問題。下拉按鈕可見，但不響應或展開。似乎在我的電腦的所有瀏覽器中運行良好。Bootstrap 3.3.5 - 導航欄切換按鈕無法在iphone上工作
我使用的引導v3.3.5和jQuery-1.11.3
<head>
<!-- Website Title & Description for Search Engine purposes -->
<title></title>
<meta name="description" content="">
<!-- Mobile viewport optimized -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<!-- Bootstrap CSS -->
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="bootstrap/fonts/bootstrap-glyphicons.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="includes/css/styles.css" rel="stylesheet">
<link href="includes/css/fonts.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600|Arvo' rel='stylesheet' type='text/css'>
<!-- Include Modernizr in the head, before any other Javascript -->
<script src="includes/js/modernizr-2.6.2.min.js"></script>
</head>
這裏是我的導航欄
<!--Navbar-->
<div class="navbar" role="navigation">
<div class="container">
<!--navbar responsive toggle-->
<div class="navbar-header">
<button class="navbar-toggle collapsed" type="button" data-target="#navbar-responsive-collapse" data-toggle="collapse" >
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- brand and toggle grouped together for better mobile display -->
<img class="navbar-brand" src="images/navbar_logo.png" alt="logo">
</div><!--end of navbar-header-->
<div class="collapse navbar-collapse" id="navbar-responsive-collapse">
<ul class="nav navbar-nav navbar-default" id="myNav">
<li class="active">
<a href="index.html"> Home</a>
</li>
<li>
<a href="services.html"> Services</a>
</li>
<li>
<a href="contact.html"> Contact</a>
</li>
</ul>
</div><!-- end of collapse-->
</div><!-- end of container-->
</div><!-- end of navbar -->
底部的鏈接。
<!-- All Javascript at the bottom of the page for faster page loading -->
<!-- First try for the online version of jQuery-->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- If no online access, fallback to our hardcoded version of jQuery -->
<script>window.jQuery || document.write('<script src="includes/js/jquery-1.11.3.min.js"><\/script>')</script>
<!-- Bootstrap JS -->
<script src="bootstrap/js/bootstrap.min.js"></script>
這裏是一個js.fiddle，如果你想看到的CSS：https://jsfiddle.net/Dinkledine/asLLydyz/8/
我已經看到了類似的帖子這一點，而這些都是我收集的解決方法。到目前爲止，他們都沒有工作。所以我開始認爲它是我的標記。
IVE嘗試：從v3.3.4到v3.3.5 更新自舉.....從1.8.2 更新jQuery來1.11.3 ..... 取代 「ontouchstart」 到 「禁止-ontouchstart」 in bootstrap.min.css
感謝您的幫助！
不確定這是否相關。但是，如果我刪除.navbar-collapse類，那麼下拉菜單會在我的iphone和我的瀏覽器中響應。然而，它會將所有內容壓低。我希望將下拉菜單擴展到以下內容。 – Dinkledine