向 Slick Slider 添加额外的 "Next" 按钮

Question

有谁知道如何向 Slick Slider 添加额外的“下一张幻灯片”按钮？我已经在使用点、上一个和下一个箭头，但在第一张幻灯片上我需要添加一个额外的“下一张幻灯片按钮”（出于设计目的）。建议...帮助...

基本上是一个前进到下一张幻灯片的按钮（因此在 tab-slick-index="0" 上转到 tab-slick-index="1"）。此按钮只会显示在第一张幻灯片上。

Answer 1

查看 https://kenwheeler.github.io/slick/ 方法部分。

可能的解决方案

在第一张幻灯片中添加按钮 <button id="nextSlideBtn">Next Slide Button</button>。

ES6

const button = document.getElementById('nextSlideBtn');
const nextSlide = (slider) => {
  $(slider).slick('slickNext');
};
button.addEventListener('click', () => {
  nextSlide(<YOUR SLIDER>);
});

ES5

var button = document.getElementById('nextSlideBtn');
var nextSlide = function nextSlide(slider) {
  $(slider).slick('slickNext');
};
button.addEventListener('click', function () {
  return nextSlide(<YOUR SLIDER>);
});

向 Slick Slider 添加额外的 "Next" 按钮

Add additional "Next" button to a Slick Slider

javascript

slick.js