覆盖光滑的轮播按钮操作

Posted 2023-05-07

【中文标题】覆盖光滑的轮播按钮操作

【英文标题】：Override slick carousel buttons action

【发布时间】：2016-06-17 18:20:45

【问题描述】：

如何更改上一个/下一个光滑按钮的操作。 我有一个可动态加载的轮播。所以我需要给按钮添加一个图片加载动作。

我尝试向光滑的声明块添加操作，例如

    $(".mySlickCarousel").slick(
        prevArrow: function () 
           // code
        
    )

也试过了：

$('.your-element .next-button').click(function(event)
  //load image
);

它也不起作用。那么浏览器只进入该功能一次。第一次。然后忽略

UPD：所以，我解决了。正如之前一位男士所说，您需要描述自己的按钮

 prevArrow: $ ('.prev'),
 nextArrow: $ ('.next'),

然后这样做

$(".next").on("click", function() 
    //your code
);

成功了！

【问题讨论】：

如果侦听器中的代码定义不应该这样做，是否可以阻止轮播转到下一张幻灯片？

【参考方案1】：

只需将加载操作加载到轮播的下一个按钮即可。

$('.your-element .next-button').click(function(event)
  //load image
);

或者使用 slick 回调事件来获得更多输入（currentSlide、nextSlide）。

$('.your-element').on('beforeChange', function(event, slick, currentSlide, nextSlide)
  //load image
);

【讨论】：

是的，第一个是最简单的方法。这是我尝试的第一件事。它不起作用。我不知道为什么，但它甚至没有进入这个功能。第二。好吧，也许它会起作用。但是我有很多事情要做，因为我必须知道方向（下一个或上一个）。顺便说一句，它也可以通过滑动来调用..无论如何...会有B计划。