javascript - Toggle menu with Jquery not working -
javascript - Toggle menu with Jquery not working -
i want create toggle menu jquery in page: http://propertymanagementoh.com/new-short-header-page/ .there menu in right top. want create toggle when click on "menu ☰" button menu appear , 1 time again when click on button disappear(like this: http://www.titleonemanagement.com/ ). have written next code not working:
<script> $(document).ready(function(){ $("#block-37").click(function(){ $("#block-38 .menu").toggle(); }); }); </script>
also used next css:
#block-38 .menu{ position:fixed; top:0; right:0; width:250px; overflow:hidden; z-index:999999; }
there 2 jquery scripts beingness used, meaning jquery.noconflict(true) causing issue sec set of jquery instructions.
advised user combine scripts , worked!
:)
additional help per comment: few things need done assist this. 1) in css add together this:
#block38 .nav-vertical.active { rgba(0,0,0,.5); position:fixed; top:0; left:0; z-index:999; width:100%; height:100%; } #whitewrap.notactive { margin-left:-235px; }
2) alter jquery
$("#block-37").click(function(){ $("#block-38 .menu").toggle(); });
to:
$("#block-37").click(function(){ $("#block-38 .menu").toggle(); $("#block38 .nav-vertical").toggleclass("active"); $("#whitewrap").toggleclass("notactive"); });
you need add together in button 1 time menu open user can close it. cross: create image or div , give class of "closenav".
then alter jquery:
$("#block-37, .closenav").click(function(){ $("#block-38 .menu").toggle(); $("#block38 .nav-vertical").toggleclass("active"); $("#whitewrap").toggleclass("notactive"); });
javascript jquery css
Comments
Post a Comment