首页 > 解决方案 > 为什么将布局更改为响应式时滑动器不起作用?

问题描述

我对演示有同样的问题:https
: //codepen.io/codenowa/pen/rNVyjGK 为什么将布局更改为响应模式(chrome)并且不重新加载页面,Swiper 无法拖动?

mySwiper = new Swiper ('.swiper-container', {
        direction: 'horizontal',
        loop: false,
        spaceBetween: 10,
        width : sizeImg,
        swipe: true,
        watchOverflow:true,
        preventClicks : false,
        preventClicksPropagation : false,
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
          },
        //And if we need scrollbar
        scrollbar: {
            el: '.swiper-scrollbar',
            draggable: true,
        },
         on: {
            sliderMove: function () {
                $.sidr('close', 'sidr');
            },
        }
    });

标签: jqueryhtmlcss

解决方案


尝试使用这个版本

https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.1.0/js/swiper.js

Codepen 中的示例:

https://codepen.io/dnjstlr555/pen/qpwRyG

推荐阅读