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

Question

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

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

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

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

JS Fiddle: https://jsfiddle.net/9z52tfkw/

我的 slick 启动代码在这里：

(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

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

Need help properly extending jQuery Slick Slider plugin to change how it slides

javascript

jquery

slider

drupal-7

slick.js