$(document).ready(function(){ $(".vis-slie").slick({ centerMode: false, variableWidth: true, arrows: false, dots:true, autoplay: true, autoplaySpeed: 5000, responsive: [ { breakpoint: 1001, settings: { autoplay: true, autoplaySpeed: 3000, } } ] }); var $banner = $('.vis-slie'); $('.control > .bt_box > .stop-slide').on('click', function() { $banner.slick('slickPause'); }); $('.control > .bt_box > .prev-slide').on('click', function() { $banner.slick('slickPrev'); }); $('.control > .bt_box >.next-slide').on('click', function() { $banner.slick('slickNext'); }); $('.rolling-banner').slick({ slidesToShow: 2, slidesToScroll: 1, autoplay: true, autoplaySpeed: 4000, variableWidth: true, responsive: [ { breakpoint: 1201, settings: { slidesToShow: 3, slidesToScroll: 1, infinite: true, } } ] }); let $banner2 = $('.rolling-banner'); $('.control2 > .bt_box > .start-slide').hide(); $('.control2 > .bt_box > .stop-slide').on('click', function() { $('.control2 > .bt_box > .start-slide').show(); $(this).hide(); $banner2.slick('slickPause'); }); $('.control2 > .bt_box > .start-slide').on('click', function() { $('.control2 > .bt_box > .stop-slide').show(); $(this).hide(); $banner.slick('slickPlay'); }); $('.control2 > .bt_box > .prev-slide').on('click', function() { $banner2.slick('slickPrev'); }); $('.control2 > .bt_box >.next-slide').on('click', function() { $banner2.slick('slickNext'); }); $(".lazy").slick({ lazyLoad: 'ondemand', // ondemand progressive anticipated infinite: true, dots: false }); });