Swiper js: destroy and init depending on screen width?

  • 0
    Hello everyone.
    Please tell me how to solve the problem. It is necessary to initialize the slider depending on the screen width.
    I made a condition, set the listinger, destroy depending on the screen width.
    It seems to work, but not as it should. If you start resizing the browser window again, then destroy stops working.
    let mql = window.matchMedia('(max-width: 767px)');
    
    mql.addEventListener('change', (e) => {
        if (e.matches) {
            let newSwiper = new Swiper('.steps-slider', {
                slidesPerView: 1,
                centeredSlides: false,
                spaceBetween: 8,
                grabCursor: true,
                init: true
            });
        } else {
            swiper.destroy();
        }
    })
    JavaScript Anonymous, Dec 1, 2020

  • 0 Answers
Your Answer
To place the code, please use CodePen or similar tool. Thanks you!