2023.03.28 コーディング
【slick.js】1枚目のスライダーが早く切り替わってしまうときの対処法
こんにちは。
あるサイトでメインビジュアルのスライダーを実装していた時にローディングを実装しているせいか、スライダーの1枚目がどうしても早く切り替わってしまうことがありました。
実はそんな調整もSlickで出来てしまいますのでご紹介いたします！
function slider() {
var $slide = $(".slider")
.slick({
infinite: true,
arrows: false,
dots: false,
autoplay: true,
// 1枚目の速度
autoplaySpeed: 5000,
speed: 2000,
})
.on({
beforeChange: function(event, slick, currentSlide, nextSlide) {
if(nextSlide > 0 ) {
// 2枚目以降の速度
$slider.slick('slickSetOption', 'autoplaySpeed', 8000, true)
}
}
});
};ポイントは「(‘slickSetOption’, ‘autoplaySpeed’, 3000, true)」は2枚目以降の切り替わり速度になる点です！是非、試してみてください！
では。
