javascript - Responsive drop down menu not rendering -
i'm trying create responsive drop down navigation menu webpage. have working drop down menu, want make when screen reaches size, ☰ icon menu items. however, when test (by re-sizing browser), see drop down menu displayed block element, , ☰ icon doesn't show. here fiddle code:
my javascript code in external file. file looks like:
$("#nav").addclass("js").before('<div id="menu">☰ </div>'); $("#menu").click(function(){ $("#nav").toggle(); }); $(window).resize(function(){ if(window.innerwidth > 768){ $("#nav").removeattr("style"); } });
and import html:
<head> <title>title</title> <link rel="stylesheet" type="text/css" href="nav-menu.css" <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script src="nav-menu.js"></script> </head>
what wrong code? appreciated. in advance.
you need add jquery library use $ object
add line in html use it
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
or choose version directly on jquery website http://jquery.com/download/
updated fiddle : http://jsfiddle.net/lwdc4/1/
Comments
Post a Comment