javascript 光滑的轮播方法

Posted 2021-05-04

$('#carousel').slick({
    dots: false, 
    arrows: true,
    infinite: true,
    autoplay: false,
    speed: 500,
    fade: false,
    slidesToShow: 1,
    pauseOnFocus: false,
    pauseOnHover: false,
    cssEase: 'linear',
    prevArrow: $('#carousel-slide-prev'),
    nextArrow: $('#carousel-slide-next'),
});

$('img').click(function() {
  // $('#lightbox').toggleClass('is-active'); // open lightbox
  var slidenum = $(this).data('slide');
  var slider = $('#carousel');
  slider.slick('slickSetOption', 'speed', 0, true); // go to slide without seeing sliding effect
  slider.slick('slickGoTo', slidenum - 1); // go to slidenum
  slider.slick('slickSetOption', 'speed', 500, true); // set speed back to normal for slide effect (in case user uses control arrows)
});