1

我想要实现的是一个基本的幻灯片，它开始，到达最后一张幻灯片并停止。我正在使用 Glide.js，因为它非常小而且非常棒，但是使用下面的代码它实际上并没有暂停，并且幻灯片再次旋转回到开头。

/**
 * Homepage Slideshow
 */
if(document.querySelector('.glide')) {
    var item_length = document.querySelectorAll('.glide__slide').length - 1;
    let glide = new Glide('.glide', {
        type: 'slider',
        startAt: 0,
        perView: 1,
        autoplay: 6000,
        hoverpause: true,
    });

    glide.on('move', (e) => { 
        if(glide.index == item_length) {
            console.log(glide.index, item_length);
            glide.pause();  
        }
    });

    glide.mount();
}

我得到了console.log结果，这告诉我5 5意味着我glide.index在第 5 张幻灯片上，并且item_length是 5。所以glide.pause()应该工作。任何帮助将不胜感激，我多年来一直在摸不着头脑。我已经尝试过run其他事件而不是移动，但仍然没有成功。

4

1 回答 1

1

尝试将倒带选项设置为 false：

/**
 * Homepage Slideshow
 */
if(document.querySelector('.glide')) {
    var item_length = document.querySelectorAll('.glide__slide').length - 1;
    let glide = new Glide('.glide', {
        type: 'slider',
        startAt: 0,
        perView: 1,
        autoplay: 6000,
        hoverpause: true,
        rewind: false,
    });


    glide.mount();
}

参考

于 2021-04-02T11:29:44.213 回答