Я пытаюсь создать панель навигации с обоими, выпадающее меню, которое всегда отображается и сбрасывается меню. Это отлично работает на настольных браузерах, но не на моем мобильном телефоне (Android 2.3.6). Вот код:Свернутое меню-кнопка не кликается в браузере Android
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<title>Pizzeria & Trattoria </title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox-1.3.4.js"></script>
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/bootstrap-responsive.css" rel="stylesheet">
<link href="css/styles.css" rel="stylesheet">
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script type="text/javascript" src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script type="text/javascript" src="js/bootstrap-modal.js"></script>
<script type="text/javascript" src="js/bootstrap-dropdown.js"></script>
<script type="text/javascript" src="js/bootstrap-collapse.js"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
$('#autostart').modal('show');
$("a.ref_pics").fancybox({'titlePosition':'inside'});
});
//]]>
</script>
</head>
<body>
<div id="autostart" class="modal hide fade">
<div class="modal-header">
<button class="close" data-dismiss="modal"><i class="icon-remove"></i></button>
<h3> </h3>
</div>
text.... <a data-dismiss="modal" class="btn pull-right" href="#">Cerrar</a>
</div>
<div class="container">
<div class="hero-unit home-bg">
<div class="row">
<div class="span9"><img src="img/logo.png" alt="Pizzeria & Trattoria " /></div>
<div class="span3">
</div>
</div>
<div class="navbar">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse" style="float:left;">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<ul class="nav pull-right">
<li class="dropdown last">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">español <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="index.php?lang=es">español</a></li>
<li><a href="index.php?lang=en">english</a></li>
<li><a href="index.php?lang=de">deutsch</a></li>
</ul>
</li>
</ul>
<div class="nav-collapse">
<ul class="nav">
<li class="active"><a href="#">Bienvenida</a></li>
<li><a href="restaurante.php?lang=es">El Restaurante</a></li>
<li><a href="menu.php?lang=es">El Menú</a></li>
<li><a href="chef.php?lang=es">El Chef</a></li>
<li><a href="pizza.php?lang=es">La Pizza</a></li>
<li class="last"><a href="contacto.php?lang=es">Contacto</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
</div>
</div>
<div class="row extrabottom">
<div class="span9">
<h1>...</h1>
<p>...</p>
<p>...</p>
<p>...</p>
<p>...</p>
</div>
<div class="span3 picbar">
<a class="ref_pics" data-rel="group1" href="img/st_titel.jpg"><img src="img/th_titel.jpg" alt="Restaurante " /></a>
<a class="ref_pics" data-rel="group1" href="img/st_kaffee.jpg"><img src="img/th_kaffee.jpg" alt="" /></a>
<a class="ref_pics" data-rel="group1" href="img/gal_387626_R_K_B_by_ermelchen_pixelio.de.jpg"><img src="img/th_pizza.jpg" alt="" /></a>
</div>
</div>
<footer class="well">
<div class="row">
<div class="span6 pull-left"><a href="imprint.php?lang=es#gastro">índice de ilustraciones</a></div>
<div class="span6 pull-right">© </div>
</div>
</footer>
</div> <!-- /container -->
</body>
</html>
Кнопка (три полосы) не кликабельна в моем браузере Android. Есть ли способ привязать кнопку onclick к кнопке, которая затем расширяет меню?
Любая помощь очень ценится.
Редактировать: Я дал складному меню идентификатор и попытался переключить его по ссылке: <a href="#" onclick="$('#mencol').collapse('toggle')">toggle menu</a> Он работает на настольных браузерах, но не на моем андроиде. Я также попытался удалить style="float:left;" с btn-navbar, снова безуспешно.
РЕШИТЬ: На догадке я удалил три начальные загрузку JavaScripts бутстраповского-modal.js, бутстраповский-dropdown.js и бутстраповский-collapse.js и добавил полный bootstrap.min.js. Сейчас работает как шарм. Очевидно андроид нужны дополнительные функции ...
Когда вы найдете решение своего вопроса, вы должны отправить его в качестве ответа и принять его. – Muhd