Diffy documentation
  • Features
    • 👋Welcome
    • Mask & Exclude
    • JavaScript snippets
    • HTTP headers
    • Cookies
    • CSS overrides
    • Mock content
    • Dealing with Dynamic Elements
      • Freeze Carousels / Sliders
      • Cookies Policy Popups
    • Configure project from YAML file
    • Zapier integration (JIRA, Trello, Basecamp integrations)
    • Bypass protection Cloudfront, Akamai, Incapsula
      • Bypass Akamai protection
      • Bypass Imperva Incapsula protection
    • Tags
    • Local development
      • DDEV add-on
      • Lando integration
      • Standalone docker container
      • Ngrok
  • Automation
    • 💡Overview
    • GitHub Pantheon CircleCI
    • GitHub Pantheon GitHub Actions
    • GitHub Tugboat
  • Tutorials
    • Comparison review
Powered by GitBook
On this page
  • Owl Carousel
  • Slick Slider
  • Swiper Carousel
  • Smart Slider
  1. Features
  2. Dealing with Dynamic Elements

Freeze Carousels / Sliders

PreviousDealing with Dynamic ElementsNextCookies Policy Popups

Last updated 2 months ago

You can use the following JavaScript snippets to freeze Sliders / Carousels on your sites. Please if we miss any slider libraries you use. There are plenty of them!

Owl Carousel

Demo site

Code:

jQuery('.owl-carousel').trigger('stop.owl.autoplay');
jQuery('.owl-carousel').trigger('to.owl.carousel', 0, 0);

Slick Slider

Demo site

Code:

jQuery('.slick-slider').slick('slickSetOption', 'autoplay', false, true);
jQuery('.slick-slider').slick('slickPause');
jQuery('.slick-slider').slick('slickGoTo', 0, true);

Swiper Carousel

Code:

document.querySelector('.swiper').swiper.autoplay.stop();
document.querySelector('.swiper').swiper.setProgress(0, 0);

Smart Slider

Code

_N2.r('#n2-ss-3', function(){
    _N2['#n2-ss-3'].pauseAutoplay();
    _N2['#n2-ss-3'].slide(0);
});

Demo site

Example:

let us know
https://owlcarousel2.github.io/OwlCarousel2/
https://owlcarousel2.github.io/OwlCarousel2/demos/autoplay.html
https://github.com/kenwheeler/slick
https://kenwheeler.github.io/slick/
https://github.com/nolimits4web/swiper
https://swiperjs.com/demos/280-autoplay/core
https://smartslider3.com/
https://pearleventsaustin.com/weddings/