带圆滑旋转木马的固定宽度幻灯片

Question

是否可以做到这一点，即幻灯片不会根据视区大小调整宽度:我的示例如下：

http://machinas.com/wip/hugoboss/responsive-template/v4/

代码如下：

$('.main-slider').slick({
         centerMode: true,
        centerPadding: '0px',
        slidesToShow: 3,
        dots: true,
         speed: 1200,
         slidesToScroll: 1,
          infinite: true,
          customPaging: function(slick,index) {
                return $('.thumbnails').eq(index).find('img').prop('outerHTML');
            },
          responsive: [
            {
              breakpoint: 640,
              settings: {
                arrows: false,
                dots: true,
                centerMode: false,
                slidesToShow: 1,
                customPaging: function(slick,index) {
                    return '<button type="button" data-role="none">' + (index + 1) + '</button>';
                  }
              }
            }
          ]
});

Answer 1

您可以使用可变宽度设置。这告诉slick让你的css来做这件事：

variableWidth: true

Answer 2

检查您的slick.js版本- variableWidth于2014年9月30日添加到版本1.3.8。

Answer 3

如果将variableWidth设置为true，请确保不使用slidesToShow设置，否则滑块将不会前进。