Twitter Bootstrap 3 barre de navigation n'est pas réactif

J'utilise Twitter Bootstrap 3. J'écris une barre de navigation simple mais ne répond pas: si je zoom dans le navigateur, la navigation Toggle ne fonctionne pas. Vous pouvez copier et coller ce fichier html et zoomer avec Google Chrome le toogle ne fonctionne pas.Twitter Bootstrap 3 barre de navigation n'est pas réactif

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en-us"> 
<head> 
    <!-- Latest compiled and minified CSS --> 
    <link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/css/bootstrap.min.css"> 

    <!-- Latest compiled and minified JavaScript --> 
    <script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/js/bootstrap.min.js"></script> 
</head> 

<body> 
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> 
    <div class="container-fluid"> 
     <!-- Brand and toggle get grouped for better mobile display --> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" href="/">Title</a> 
     </div> 
     <!-- Collect the nav links, forms, and other content for toggling --> 
     <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
      <ul class="nav navbar-nav navbar-right"> 
       <li class="active"><a href="/about">About</a></li> 
       <li><a href="/">Blog</a></li> 
      </ul> 
     </div><!-- /.navbar-collapse --> 
    </div><!-- /.container-fluid --> 
</nav> 

</body> 
</html>

Pouvez-vous m'aider?

Source

2014-04-19 user1066183

Vous oubliez d'inclure Jquery! Ajoutez ceci dans vos étiquettes de tête.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

Source

2014-04-19 14:33:57

I zoom dans le navigateur et la navigation Toggle travaillé. Peut-être un autre problème que vous rencontrez.

DEMO

without zoom

with zoom

Source

2014-04-19 14:33:26 4dgaurav

Cela fonctionne dans Jsfiddle, mais pas dans une application réelle car jsfiddle inclut automatiquement jquery. –

Fiddle ne comprend pas jquery automatiquement, j'ai effectivement inclus jquery dans le violon, vous pouvez voir dans la gauche .. :) – 4dgaurav

Ahh! Je le vois maintenant. Désolé, difficile à voir sur les photos de mon téléphone ... –

Twitter Bootstrap 3 barre de navigation n'est pas réactif

Répondre

Questions connexes