Slider Revolution WP
09.27.2016
For version 5.0+, this can now be easily achieved with the “Stop Slider out of Viewport” option shown here.
If you already have some type of “window scroll” script, you can integrate parts of the example into your current script. Otherwise, add the example script below to the slider’s Custom JavaScript section.
Before starting, it will be important to find your slider’s “API Name”. You can find this in your slider’s API Section, in the slider’s main settings page. Once you get your slider’s “revapi” name, replace the “revapi1” part in the beginning of the script below.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
(function() { var win, slider, sliderHeight, sliderPaused, winHeight; // Change the "revapi1" part here to whatever "revapi" name that your slider uses slider = revapi1.on('revolution.slide.onloaded', function() { win = jQuery(window).on('scroll', checkScroll).on('resize', sizer); sizer(); }); function sizer() { sliderHeight = slider.height(); winHeight = win.height(); checkScroll(); } function checkScroll() { var scrTop = win.scrollTop(), offset = slider.offset().top; if(offset <= scrTop + winHeight && offset + sliderHeight >= scrTop) { if(sliderPaused) slider.revresume(); sliderPaused = false; } else { if(!sliderPaused) slider.revpause(); sliderPaused = true; } } })(); |