javascript - 如何更改 swiper.js 中 swiper 的延迟?

标签 javascript html jquery swiper.js

我正在使用 swiper.js 制作图像和视频的幻灯片。在这里,我想更改用户单击按钮时的延迟。但我不知道如何更改 swiper 的延迟或任何其他方法来做到这一点?

我已阅读 swiper.js 的文档,但在创建 swiper 对象后没有更改延迟的功能。

JSFiddle(code)

  <div id="swiper" class="swiper-container mySwiper">
    <div class="swiper-wrapper">
       <div class="swiper-slide">
            <img src="static\images\arlens.gif" alt="ar">
            <span class="subtitle">
                Hi, Reader Thanks for reading
            </span>
        </div>
    </div>
    <div class="swiper-button-next" id="swiper-button-next"></div>
    <div class="swiper-button-prev" id="swiper-button-prev"></div>
</div>
<div class="speed_btns" id="speed_btns">
    <button onclick="change_speed(7500)">1x</button>
    <button onclick="change_speed(5500)">2x</button>
    <button onclick="change_speed(2500)">3x</button>
</div>

JS

let speed = 2500
var swiper2 = new Swiper(".mySwiper", {
        centeredSlides: true,
        autoplay: {
            delay: speed,
            disableOnInteraction: false,
        },
        navigation: {
            nextEl: ".swiper-button-next",
            prevEl: ".swiper-button-prev",
        },

    });
   
  function change_speed(speed){
          // WANT TO CHANGE 'delay' OF 'swiper2' TO 'speed'
  }

希望你能指导我......

最佳答案

一个possible approach ,遵循 this issue 中给出的建议:

function change_speed(speed){
  swiper2.params.autoplay.delay = speed;
}

当您将 Swiper 实例存储在变量中时,您可以使用它直接修改其所有设置。您需要的延迟 - 位于 autoplay 部分,根据 to docs .

关于javascript - 如何更改 swiper.js 中 swiper 的延迟?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/68235816/

相关文章:

javascript - knockout : remove select options from array when already in use

jquery - 如何使用 jQuery 实现 &lt;input type ="text"> 的 onchange?

javascript - JQuery 过渡切换类不起作用

javascript - jquerymobile 弹出功能在 onClick 中不起作用

Javascript 排序功能在 Safari/iPhone 中不起作用

javascript - 如何在 JS 中使用 if/else 使 div 执行其样式动画

javascript - PHP - 未检测到 isset($_POST ['rejectSeed' ])

javascript - Grunt-injector - 首先注入(inject)父目录

html - 放大图像的特定区域

单击时 JavaScript 不工作