Glide: Multiple slideshows on the same page?

[dkindnes]

Hi,
Is it possible to have multiple instances of the slideshow on the same page?
I have it working using different ids but all the navigation options trigger every slideshow.
ie. clicking the next arrow moves all slideshows / pressing the keyboard arrow moves all slideshows

Is there is a way to force each navigation method to only work on its associated slideshow?

[dkindnes]

Just to add - the problem with the arrows only happens if one slideshow has arrows set to false but the other has it set to true.
If all slideshows have arrows set to true then they work independently.

[nirname]

Hi,
Actually I got this having both sliders with arrows. Arrow does not work. Neither do pagination links.

[fabbrikk]

Hi, I've temporarily resolved this issue by doing this hack (I'm using jquery here):

    $('.slider').each(function(){
        var item = $(this);
        var d = new Date();
        item.attr('id', 'glide-'+d.getTime());

        $('#'+item.attr('id')).glide({
            autoplay: false,
            arrows: '#'+item.attr('id'),
            navigation: '#'+item.attr('id'),
            arrowLeftText: '<div></div>',
            arrowRightText: '<div></div>'
        });
    });

In essence, for every instance of glide I'm going to create a unique id and the assign arrows and navigationto this id.
Hope this help someone until this bug is not resolved.

[jedrzejchalubek]

Glide has been released in version v2.0.0. If the problem remains, please set up a new thread.

[ali-rival]

const carousels = document.querySelectorAll(".carousels");

Object.values(carousels).map(carousel => {
      const slider = new Glide(carousel, {
        type: "carousel"
      });
      slider.mount();
});