javascript - window resize function randomly not working -

i'm working on responsive menu, using js/jquery. menu works, if resize window within 'mobile' area (1024px), function dropdown tabs toggle randomly stop working..

here script:

$(document).ready(function(){     function mobile(){         $('.menu-toggle').click(function(){         $('#menum').toggle();     }); }  $(window).resize(mobile); mobile();  function resmenu() {     var stest = $('#sizetest').css('float');     $('#sizetesttext').text("current sizetest = " + stest);      if (stest === 'left') {         $('nav').attr('id', 'menum');         $('#menum').hide();         $('#menum .has-sub').click(function(e) {             e.preventdefault();             $('#menum ul li').not($(this).parent()).removeclass('tap');             $(this).parent().toggleclass('tap');         });     }     else {         $('nav').attr('id', 'menu');         $('#menu').show();         $('#menum ul li').removeclass('tap');     }      var navtest = $('nav').attr('id');     $('#linktest').text("current nav id = " + navtest); }  $(window).resize(resmenu); resmenu(); }); 

any appreciated.

you have event handler inside event handler, refactored code looks like

$(window).resize(function() {     $('.menu-toggle').click(function(){         $('#menum').toggle();     }); }); 

as resize event fires hundreds, maybe thousands of times when window resized, you've added few thousand click handlers.

the many, many click handlers are cancelling each other out, hence it's working when have odd number of click handlers, when end number of click handlers, instance when resize event fires 1032 times, toggle effect cancelled out.