如何解决es6 轮播中的无限循环滑块?
我创建了一个 Es6 轮播。
我想在无限循环中显示幻灯片。我遵循以下方法。或者想使用下面的方法来实现无限轮播。 Infinity Loop Slider Concepts 我没有使用 jquery。我正在使用 vanilla js。
在我的演示应用程序中。我无法克隆元素以在同一方向显示元素。现在,当用户移动到最后一个元素时。我的轮播移动到反向并显示第一张幻灯片。
这是我的代码 https://plnkr.co/edit/Ugk31iBnBj0R3e6c?open=lib%2Fscript.js&preview
nextSlide() {
const t = this;
const opts = t.options;
let nextSlide = t.activeSlide + 1;
if (t.activeSlide >= t.slidesLength && !t.isEnabledOption("loop")) {
t._paused = true;
return;
}
if (nextSlide > t.slidesLength) {
nextSlide = 1;
}
if (isFunction(opts.beforeChange)) {
opts.beforeChange.call(t,t,t.activeSlide,nextSlide,t.slidesLength);
}
t.activeSlide >= t.slidesLength && t.isEnabledOption("loop")
? (t.activeSlide = 1)
: (t.activeSlide += 1);
t._setActiveSlide();
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。