can not re-initialize glider

[kull102]

Hi guys, I'm trying to re-initialize glider when user resize the window but it does not work. Can anyone help me?

const MOBILE_WIDTH = 768;
// const glider_container = document.querySelector("glider_container")
let glider = null;

function initializeGlider() {
    const currentWidth = window.innerWidth;

    if (currentWidth < MOBILE_WIDTH && !glider) {
        glider = new Glider(document.querySelector('.glider-headliners'), {
            slidesToShow: 1,
            draggable: true,
            dots: '.headlinears-dots',
        });
    }


    if (glider && currentWidth >= MOBILE_WIDTH  ) {
        glider?.destroy();

    }

}

document.addEventListener('DOMContentLoaded', function () {
    initializeGlider();
});

window.addEventListener('resize', function () {
    initializeGlider();
});

[NickPiscitelli]

You need to loop the elements and initialize, like this:

document.querySelectorAll('.glider-headliners').forEach(glider => {
    new Glider(document.querySelector('.glider-headliners'), {
        slidesToShow: 1,
        draggable: true,
        dots: '.headlinears-dots',
    });
});