css - Bootstrap collapse js file giving error -


i have following test code:

<html lang="en">   <head>     <meta charset="utf-8">     <title>ti productions</title>     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <meta name="description" content="">     <meta name="author" content="">     <!-- le styles -->     <link href="assets/css/bootstrap.css" rel="stylesheet">     <style type="text/css">       body {         padding-top: 60px;         padding-bottom: 40px;       }     </style>     <link href="assets/css/bootstrap-responsive.css" rel="stylesheet">   </head> <body>      <div class="navbar">     <div class="navbar-inner">     <div class="container">      <!-- .btn-navbar used toggle collapsed navbar content -->     <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">     <span class="icon-bar"></span>     <span class="icon-bar"></span>     <span class="icon-bar"></span>     </a>      <!-- sure leave brand out there if want shown -->     <a class="brand" href="#">project name</a>      <!-- want hidden @ 940px or less, place within here -->     <div class="nav-collapse collapse">     <!-- .nav, .navbar-search, .navbar-form, etc -->                <ul class="nav">               <li><a href="">home</a></li>               <li><a href="">about</a></li>               <li><a href="">help</a></li>           </ul>     </div>      </div>     </div>     </div>      <script src="assets/js/bootstrap-collapse.js"></script>   </body>  </html> 

i'm trying test out collapsable menu shown here:

http://twitter.github.io/bootstrap/components.html#navbar

i've downloaded boostrap responsive css file per instructions, , collapse.js file. page loads file, menu showing. when shrink browser size, menu collapses..and button appears. can't open menu. whenever click on button display collapsed menu, following error:

-- [19:08:40.348] typeerror: $ undefined @ https://myserver/mysite/assets/js/bootstrap-collapse.js:126 

line 126 of file looks this:

  $.fn.collapse = function (option) { 

i'm not sure i'm doing wrong. guesstions appreciated.

edit 1

i've added in missing jquery.js file hasn't resolved issue. includes @ bottom of page looks this:

<script src="assets/js/jquery.js"></script> <script src="assets/js/bootstrap-collapse.js"></script> 

the $ jquery function , needs included before bootstrap-collapse.js.

try sequence

<script src="assets/js/jquery.js"></script> <script src="assets/js/bootstrap-collapse.js"></script> 

Comments

Popular posts from this blog

SPSS keyboard combination alters encoding -

Add new record to the table by click on the button in Microsoft Access -

javascript - jQuery .height() return 0 when visible but non-0 when hidden -