固定宽度的滑梯与光滑的旋转木马

use*_*021 7 jquery

是否可以实现这一点,即幻灯片的宽度不会根据视口大小进行调整:我的例子如下:

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>';
                  }
              }
            }
          ]
});
Run Code Online (Sandbox Code Playgroud)

小智 18

您可以使用可变宽度设置.这告诉光滑让你的css完成工作:

variableWidth: true
Run Code Online (Sandbox Code Playgroud)