Swiper JS，如何在freemode中触摸swiper包装器？

Question

我有一个滑块在自由模式下使用swiper js，最多可以有100个幻灯片，当用户滑动时我们需要它们能够在触摸或点击时停止滑块。

Answer 1

是的我用过这个功能

function stopCarouselOnTouch() {
    var slider_wrap = $('.slider-wrap');
    var translation = getTransform(slider_wrap);


    var translationX = translation[0];
    var translationY = translation[1];
    var absX = Math.abs(translationX);
    var absY = Math.abs(translationY);

    // stops the carousel at the current value
    $('.swiper-wrapper').css({'transform': 'translate3d(' + translationX + 'px , ' + translationY + 'px, 0px)'});
    $('.swiper-wrapper').css('webkit-transition-duration', '0s');

    // finds css translation values
    function getTransform(el) {

        var transform = window.getComputedStyle(document.getElementById('slider-wrap'), null).getPropertyValue('transform');
        var results = transform.match(/matrix(?:(3d)\(-{0,1}\d+\.?\d*(?:, -{0,1}\d+\.?\d*)*(?:, (-{0,1}\d+\.?\d*))(?:, (-{0,1}\d+\.?\d*))(?:, (-{0,1}\d+\.?\d*)), -{0,1}\d+\.?\d*\)|\(-{0,1}\d+\.?\d*(?:, -{0,1}\d+\.?\d*)*(?:, (-{0,1}\d+\.?\d*))(?:, (-{0,1}\d+\.?\d*))\))/);

        var result = [0,0,0];
        if(results){
          if(results[1] == '3d'){
            result = results.slice(2,5);
          } else {
            results.push(0);
            result = results.slice(5, 9); // returns the [X,Y,Z,1] value;
          }

        };
        return result;
    }
}

然后我在里面打电话

on: {
 touchStart: function() {

  stopCarouselOnTouch();

 },
}