JSで応答するnavbar

-1

私は現在、JSアプリケーションとブートストラップで作業しています。私のウェブサイトのインデックスファイルには、JSで応答するnavbar

 <div id="app"></div>

と一部のスクリプトのみが含まれています。

Now I'm wanting to implement an responsive navbar into the app.js with data-toggle but haven't figured it out yet. 

    var Navbar = React.createClass({ 
    displayName: 'Navbar', 
    render: function() { 
    return el.nav(
     {className: 'navbar navbar-inverse navbar-fixed-top'}, 
     el.div(
     {className: 'container'}, 
     el.div(
      {className: 'navbar-header'}, 
      el.a({className: 'navbar-brand', href:'/'}, config.app_name)

それに実装さ

   <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
      <span class="sr-only">Toggle navigation</span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      </button>

により、応答することが必要です。これを修正する方法は現在私がこの問題を解決する方法を見ていないためです。

出典

2016-03-22 Ubuntuser

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<title>Bootstrap Case</title> 
<meta charset="utf-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"> </script> 
</head> 
<body> 

<nav class="navbar navbar-inverse"> 
<div class="container-fluid"> 
<div class="navbar-header"> 
    <a class="navbar-brand" href="#">WebSiteName</a> 
</div> 
<ul class="nav navbar-nav"> 
    <li class="active"><a href="#">Home</a></li> 
    <li><a href="#">Page 1</a></li> 
    <li><a href="#">Page 2</a></li> 
    <li><a href="#">Page 3</a></li> 
</ul> 
</div> 
</nav> 

<div class="container"> 
<h3>Inverted Navbar</h3> 
<p>An inverted navbar is black instead of gray.</p> 
</div> 

</body> 
</html>

あなた自身

でそれを記述する必要はありませんブートストラップはJQuery fonctionを使用

出典

2016-03-22 15:30:37

答えて

関連する問題