Level Extreme platform
Subscription
Corporate profile
Products & Services
Support
Legal
Français
Bootstrap 3 Collapse Menu Does not work
Message
From
08/03/2014 03:15:36
 
General information
Forum:
CSS
Category:
Other
Miscellaneous
Thread ID:
01595941
Message ID:
01595957
Views:
58
>>>I have a strange situation. I found a Fiddle that has an example of Bootstrap 3 Collapse menu. The menu that collapses into a button when the browser gets to the mobile size. And then by clicking on the button the menu is opened. When I run this code in the Fiddle, it works. This is the Fiddle:
>>>
>>>http://jsfiddle.net/9pruK/
>>>
>>>But when I created a test.html with exactly the code from this fiddle it does not work. That is, in my test.html the button is created but clicking on the button does not produce the menu. I have compared the Bootstrap.css in the Fiddle and the one I use and it is the same (the size is exactly the same). What can be causing my test.html not to work?
>>
>>I'm using a similar menu layout and it works as advertised :-]
>>Can you post your html (I know you say it's *exactly* the same but .....)
>>And are you using the same browser with your html as when running the Fiddle example ?
>
>Yes, the same browser, IE 10. That is, I open the Fiddle link in the same IE as the test.html.
>
>this is my test.html:
>
>
><!DOCTYPE html>
>
><html>
><head>
>    <title></title>
>    <link href="content/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/> 
></head>
><body>
>    <div class="navbar-wrapper">
><div class="navbar navbar-inverse navbar-fixed-top"  role="navigation">
>  <div class="container">
>    <div class="navbar-header">     
>            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#nav-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="index.html">Project name</a>        
>    </div>
>    <div class="collapse navbar-collapse" id="nav-collapse">
>    <ul class="nav navbar-nav">
>        <li class="active"><a href="index.html">Home</a></li>
>        <li><a href="about.html">About</a></li>
>        <li><a href="work.html">Work</a></li>
>
>    </ul>
>    <ul class="nav navbar-nav navbar-right">
>
>        <li><a href="#modal-contact-form" data-toggle="modal" data-target="#modal-contact-form">Contact</a></li>
>
>    </ul>
>
>    </div><!--/.navbar-collapse -->
>  </div>
></div>
></div>
></body>
></html>
>
Hi,

You need script references to jquery.js and bootstrap.js. for the animation - if you look in Fiddle jquery is set in the 'Framework and Extensions' section and bootstrap.min.js in 'External Resources'
Previous
Next
Reply
Map
View

Click here to load this message in the networking platform