javascript - JQuery resize performance issue -


i built slider moves left or right if items hidden. needs work responsively, using resize (smartresize) function check when browser resized. works, after resizing when click more (right arrow) takes 2-5 seconds calculate hidden , execute.

can explain me why happening, , how possibly fix it?

thanks!

$(window).smartresize(function () {     var cont = $('#nav-sub-menu-2 .container');     var ul = $('#nav-sub-menu-2 ul');     var li = $('#nav-sub-menu-2 ul li');      var amount = li.length;     var width = li.width();     var contwidth = cont.width();      var ulwidth = width * amount;     var remainder = ulwidth - contwidth;      ul.width(ulwidth);      if(remainder <= 0) {         $('.more, .less').fadeout();     } else {         $('.more').fadein();     }      $('.more').click(function() {         ul.animate({ 'right' : remainder });         $(this).fadeout();         $(".less").fadein();     });      $('.less').click(function() {         ul.animate({ 'right' : 0 });         $(this).fadeout();         $(".more").fadein();     });   }).smartresize(); 

it because recalculating screen size @ every interval resizing...

try using debouncer delay function calls until everything's settled.

/* debounce resize */ function debouncer( func , timeout ) {    var timeoutid , timeout = timeout || 200;    return function () {       var scope = , args = arguments;       cleartimeout( timeoutid );       timeoutid = settimeout( function () {           func.apply( scope , array.prototype.slice.call( args ) );       } , timeout );    } }  $( window ).resize( debouncer( function ( e ) {     /* function */ })); 

Comments

Popular posts from this blog

Email notification in google apps script -

c++ - Difference between pre and post decrement in recursive function argument -

javascript - IE11 incompatibility with jQuery's 'readonly'? -