javascript - bootstrap navbar mobile toggle not working -


i loaded bootstrap css , js files , added html code of following. both succesfully loaded - css in head tag , js below footer. other functions working fine.

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">   <div class="container container-header">    <!-- brand , toggle grouped better mobile display -->   <div class="navbar-header">     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">       <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="{{ url_for('public.home') }}">        nektime      </a>   </div>   <!-- collect nav links, forms, , other content toggling -->   <div class="collapse navbar-collapse navbar-ex1-collapse">     <ul class="nav navbar-nav">       <li><a href="{{ url_for('public.home') }}">home</a></li>       <li><a href="{{ url_for('public.about') }}">about</a></li>     </ul>     {% if current_user , current_user.is_authenticated() %}     <ul class="nav navbar-nav navbar-right">         <li>             <p class="navbar-text"><a class="navbar-link" href="{{ url_for('user.members') }}">logged in {{ current_user.username }}</a></p>         </li>         <li><a class="navbar-link" href="{{ url_for('public.logout') }}"><i class="fa fa-sign-out"></i></a></li>      </ul>     {% elif form %}     <ul class="nav navbar-nav navbar-right">       <li><a href="{{ url_for('public.register') }}">create account</a></li>     </ul>     <form id="loginform" method="post" class="navbar-form form-inline navbar-right" action="/" role="login">       {{ form.hidden_tag() }}       <div class="form-group">         {{ form.username(placeholder="username", class_="form-control") }}         {{ form.password(placeholder="password", class_="form-control") }}       </div>       <button type="submit" class="btn btn-default">log in</button>     </form>     {% endif %}   </div><!-- /.navbar-collapse -->   </div><!-- /.container --> </nav> 

when shrink browser, toggle button replaces other menus, cannot expand toggle button. managed right data-target.. don't know next

i added collapsed class in button tag, , works. following code.

 <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-ex1-collapse"> 

Popular posts from this blog

c# - ODP.NET Oracle.ManagedDataAccess causes ORA-12537 network session end of file -

matlab - Compression and Decompression of ECG Signal using HUFFMAN ALGORITHM -

utf 8 - split utf-8 string into bytes in python -