javascript - Throttle my page scroll so it only skips one slide -


seems such easy fix cant seem it. need throttle or debounce scroll in javascript slide skips next slide. @ moment counting number of times scroll clicks , scrolls many slides. using revolution slider on wordpress site.

i have current code make slide use on mouse scroll skip next slide.

(function() {  	  	// change "revapi1" here whatever api name slider uses (see notes below)  	var slider = revapi1;  	  	slider.parent().on('mousewheel dommousescroll', function(event) {  		  		if(event.originalevent.wheeldelta > 0 || event.originalevent.detail < 0) {  		  			slider.revprev();  			  		}  		else {  		  			slider.revnext();                			  		}  		  	});  	  })()   

but can see problem on www.bladeworks.co.za/blade_website_new skips slides dependent on mouse scrolls done.

is there anyway can edit code make skip 1 slide , go next one?

i appreciate help.

   function throttle(fn, threshhold, scope) {         threshhold || (threshhold = 250);         var last,         defertimer;     return function () {         var context = scope || this;          var = +new date,         args = arguments;         if (last && < last + threshhold) {         // hold on              cleartimeout(defertimer);              defertimer = settimeout(function () {              last = now;              fn.apply(context, args);         }, threshhold);         } else {              last = now;              fn.apply(context, args);         }     };  } 

refrenced here simple throttle function

  element.on('mousewheel dommousescroll',throttle(function(){       ...   })) 

or can use "lock" lock event handler when slider moving:

  element.on('mousewheel dommousescroll',function(){       if(!element.hasclass('locked')){           element.addclass('locked');           ...//process, move next, move previous           element.removeclass('locked');       }   }) 

this 1 easy understand

a complete one:

 (function() {          var slider = revapi1;         slider.parent().on('mousewheel dommousescroll',throttle(function(event) {              if(event.originalevent.wheeldelta > 0 ||     event.originalevent.detail < 0) {                 slider.revprev();              }else {                 slider.revnext();              }       },250));     function throttle(fn, threshhold, scope) {          threshhold || (threshhold = 250);          var last,          defertimer;          return function () {              var context = scope || this;               var = +new date,              args = arguments;              if (last && < last + threshhold) {                   // hold on                   cleartimeout(defertimer);                   defertimer = settimeout(function () {                        last = now;                        fn.apply(context, args);                   }, threshhold);               } else {                   last = now;                   fn.apply(context, args);               }         };      }   })()    

Comments

Popular posts from this blog

php - Wordpress website dashboard page or post editor content is not showing but front end data is showing properly -

javascript - Get parameter of GET request -

javascript - Twitter Bootstrap - how to add some more margin between tooltip popup and element -