Swiper JS返回第一张幻灯片

Question

我有滑块和滑块js，当我们点击幻灯片末尾的下一个按钮时它如何返回到第一张幻灯片？

http://idangero.us

Answer 1

您可以设置loop参数。例如：

var mySwiper = new Swiper ('.swiper-header', {
  loop: true, //this should allow the last next button to return to the beginning
  nextButton: '.swiper-button-next',
  prevButton: '.swiper-button-prev',
});

Answer 2

我做了这样的功能：
.swiper-next是：导航-nextEl

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//ins[@class='check-helper']"))).click()

Answer 3

您可以使用来自 Swiper API 的“点击”事件。

注意：setTimeout是正确确定幻灯片索引所必需的

const swiper_instance = new Swiper('.swiper-container', {
  // ...
});

swiper_instance.on('click', function (swiper, event) {
    const is_next_click = event.target === swiper.navigation.nextEl,
        is_prev_click = event.target === swiper.navigation.prevEl,
        is_end = this.isEnd,
        is_beginning = this.isBeginning;

    // slide to begin
    if (is_next_click && is_end) {
        setTimeout(() => swiper.slideTo(0))
    }

    // slide to end
    if (is_prev_click && is_beginning) {
        setTimeout(() => swiper.slideTo(swiper.slides.length))
    }
});