需要帮助正确扩展 jQuery Slick Slider 插件以更改其滑动方式

Question

我的任务是更改滑块的工作方式。我们使用名为 Slick Slider 的 jQuery 插件来显示新闻简介。

他们希望我做的是让上一个/下一个按钮和自动播放功能在所有模式（移动设备、平板电脑和桌面）下一次移动一张幻灯片。好的，没问题，我很容易设置。然后他们要求我对其进行更改，以便每 3 张幻灯片显示一个点，然后单击这些点一次移动 3 张幻灯片。

显然，这需要我对 slick.js 中的函数进行修改。我没有看到任何内置功能可以做到这一点。我试图弄清楚如何扩展这个库并一次覆盖一个函数。老实说，我不确定如何使用 jQuery 插件正确执行此操作。

由于我们在 Drupal 中运行它，这使情况变得复杂。我已经设置了一个与我们现在正在做的非常接近的 JS Fiddle。

JS 小提琴：https://jsfiddle.net/9z52tfkw/

我的启动代码在这里：

(function($) {
  $('.my-slider').slick({
        speed: 1000,
        autoplay: true,
        dots: true,
        mobileFirst: true,
        slidesToShow: 1,
        slidesToScroll: 1,
        focusOnSelect: true,
        appendArrows: $('.controls'),
        prevArrow: '<button type="button" class="prev">Prev</button>',
        nextArrow: '<button type="button" class="next">Next</button>',
        responsive: [
          {
            breakpoint: 960,
            settings: {
              dots: true,
              slidesToShow: 3
            }
          },
          {
            breakpoint: 769,
            settings: {
              dots: true,
              slidesToShow: 2
            }
          }
        ]
      });
}(jQuery));

Slick Slider 的详细信息和代码可以在这里找到：http://kenwheeler.github.io/slick

我使用的是 1.5.6 版。可以在此处找到相同版本的 slick.js 的副本：https://github.com/kenwheeler/slick/blob/1.5.6/slick/slick.js

为了澄清，我不是要求任何人为我做覆盖。相反，我正在寻求帮助以覆盖插件的功能或以其他方式扩展插件。我有能力从那里，但会感谢提供的任何帮助。

我认为这对我将来使用其他 jQuery 插件也会有所帮助。谢谢！

Answer 1

你总是可以只删除三个点中的两个 :)

即将此添加到初始化的末尾：

.find('.slick-dots li').filter(function(i,e){
    return (i % 3 != 0);
}).hide();

JSFiddle：https://jsfiddle.net/TrueBlueAussie/9z52tfkw/2/

举个更明显的例子：jsfiddle.net/9z52tfkw/3