Glide.js 滑块不会在最后一张幻灯片上暂停
Glide.js slider not pausing on last slide
我想要实现的是一个基本的幻灯片放映,它开始,到达最后一张幻灯片并停止。我正在使用 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
意思是我在第 5 张幻灯片的 glide.index
上,item_length
是 5。所以glide.pause()
应该可以。任何帮助将不胜感激我一直在挠头多年。我已经尝试 run
和其他事件而不是移动但仍然没有成功。
尝试将倒带选项设置为 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();
}
我想要实现的是一个基本的幻灯片放映,它开始,到达最后一张幻灯片并停止。我正在使用 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
意思是我在第 5 张幻灯片的 glide.index
上,item_length
是 5。所以glide.pause()
应该可以。任何帮助将不胜感激我一直在挠头多年。我已经尝试 run
和其他事件而不是移动但仍然没有成功。
尝试将倒带选项设置为 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();
}