html - Close Jquery Sliding Menu when clicked or touched anywhere in body -


i require create sliding menu left. have create close menu need again touch / click navigation icon. need menu slide in when touches outside menu area.

link have done far. http://rpinvestments.co.in/app/

following js code:

/*main navigation*/ $(function() {     var html = $('html, body'),         navcontainer = $('.nav-container'),         navtoggle = $('.nav-toggle'),         navdropdowntoggle = $('.has-dropdown');      navtoggle.on('click', function(e) {         var $this = $(this);         e.preventdefault();         $this.toggleclass('is-active');         navcontainer.toggleclass('is-visible');         html.toggleclass('nav-open');     });      navdropdowntoggle.on('click', '*', function(e) {         e.stoppropagation();     });   }); 

try this:

jsfiddle demo

var html = $('html, body'),     navcontainer = $('.nav-container'),     navtoggle = $('.nav-toggle'),     navdropdowntoggle = $('.has-dropdown');  navtoggle.on('click', function(e) {   var $this = $(this);   e.preventdefault();   e.stoppropagation(); //<-- added   $this.toggleclass('is-active');   navcontainer.toggleclass('is-visible');   html.toggleclass('nav-open'); });  navdropdowntoggle.on('click', '*', function(e) {   e.stoppropagation(); });  $('body').click(function(){ //<--- added section     navtoggle.toggleclass('is-active');     navcontainer.toggleclass('is-visible');     html.toggleclass('nav-open'); }); 

Comments

Popular posts from this blog

sublimetext3 - what keyboard shortcut is to comment/uncomment for this script tag in sublime -

java - No use of nillable="0" in SOAP Webservice -

ubuntu - Laravel 5.2 quickstart guide gives Not Found Error -