iOS 忽略 Swiper 库的容器宽度答案

【问题标题】：iOS ignores container width for Swiper galleryiOS 忽略 Swiper 库的容器宽度
【发布时间】：2016-11-28 10:16:01
【问题描述】：

我正在制作一个简化的滑动器图库，我只需要它来隐藏默认浏览器滚动条并滑动浏览图像。我正在为滑动逻辑使用 jQuery 和 TouchSwipe 插件。到目前为止，我已经编写了这段代码：https://jsfiddle.net/drbj6zk8/5/。我添加了容器（通过获取 (div.swipe - div.swipe-wrapper) 计算得出），并且刷卡器不应超出这些边界。

$(函数() {

var currentTranslation = 0;
var lastDistance = 0;
var translationDelta = 0;
var containerLengthArr = $('div.swipe-slide');
var containerLength = 0;
var containerBorder = 0;

$("#test5").swipe({
    swipeStatus: swipe2,
    allowPageScroll: "horizontal"
});
/*TODO*/

$.each(containerLengthArr, function(e) {
    containerLength += ($(this).width() + 10);
})
$('.swipe-wrapper').width(containerLength + 5);
containerBorder = $('.swipe').width() - $('.swipe-wrapper').width();
console.log(containerBorder);

//Swipe handlers

function swipe2(event, phase, direction, distance) {
    var check = $(this).children('.swipe-slide');
    if (phase == "end") {
        translationDelta = 0;
    } else {
        translationDelta = lastDistance - distance;
    }
    /*Check direction*/
    if (direction == "right") {
        currentTranslation -= translationDelta;
    } else if (direction == "left") {
        currentTranslation += translationDelta;
    }
    var distance2 = 0;
    /*Limit slider to wrapper lenghth*/
    if (currentTranslation > 0) {
        distance2 = "translateX(" + 0 + "px)";
        currentTranslation = 0;
    }
    else if (currentTranslation < containerBorder) {
        distance2 = "translateX(" + containerBorder + "px)";
        currentTranslation = containerBorder;
    }
    else {
        distance2 = "translateX(" + currentTranslation + "px)";
    }

    check.css('transform', distance2);
    lastDistance = distance;

    console.log(currentTranslation);
}

});

当然，在桌面浏览器和 Android 设备上一切正常，但我在 iOS 设备上遇到了问题。不同设备（iphone 5、iphone 6、iPad）的行为绝对没有一致性。在所有这些上，我得到了不同的，更重要的是被破坏的行为（滑块看起来不一样，更重要的是，滑动器超出了设定的边界）。

有人知道我缺少什么，或者是否有一些特定要求才能在 iOS 上运行？

【问题讨论】：

标签： javascript jquery ios iphone ipad

【解决方案1】：

我做了更多的挖掘，结果发现这是 jquery 插件的一个错误。它不能正确“读取”iOS 上的距离。提供的解决方法是降级到版本 1.6.9 或编辑插件。

参考：https://github.com/mattbryson/TouchSwipe-Jquery-Plugin/issues/260

【讨论】：