I am trying to use the slick carousel from this website http://kenwheeler.github.io/slick/ and I am trying to use multiple features. There is some overlapping code that is probably causing problems. Autoplay and fade is not working with the other features. A simple deletion of some of the repetitive code should make this code function.
$(document).ready(function(){
$('.carousel').slick({
/* Multiple */
infinite: true,
slidesToShow: 3,
slidesToScroll: 3
/* Variable Width */
dots: true,
infinite: true,
speed: 300,
slidesToShow: 1,
centerMode: true,
variableWidth: true
/* Autoplay */
slidesToShow: 3,
slidesToScroll: 1,
autoplay: true,
autoplaySpeed: 2000,
/* Fade */
dots: true,
infinite: true,
speed: 500,
fade: true,
cssEase: 'linear'
});
});
I just did a JS fiddle using your code. The carousel works, but it needs some styling: http://jsfiddle.net/77vsunov/
$(document).ready(function(){
$('.carousel').slick({
/* Multiple */
infinite: true,
slidesToShow: 3,
slidesToScroll: 3,
/* Variable Width */
dots: true,
infinite: true,
speed: 300,
slidesToShow: 1,
centerMode: true,
variableWidth: true,
/* Autoplay */
slidesToShow: 3,
slidesToScroll: 1,
autoplay: true,
autoplaySpeed: 2000,
/* Fade */
dots: true,
infinite: true,
speed: 500,
fade: true,
cssEase: 'linear'
});
});
I took your code, added the needed commas and it appears to be working properly.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.