iOS에서 스 와이프 갤러리의 컨테이너 너비를 무시합니다.

단순화 된 스 와이퍼 갤러리를 만들고 있는데, 기본 브라우저 스크롤러를 숨기고 이미지를 스 와이프하면됩니다. 스 내핑 로직에 jQuery와 TouchSwipe 플러그인을 사용하고 있습니다. 지금까지이 코드를 작성했습니다 : https://jsfiddle.net/drbj6zk8/5/. 나는 점점에 의해 계산 된 컨테이너를 (추가 한 (div.swipe - div.swipe - 래퍼)과 swiper은이 경계선을 가지 말았어야iOS에서 스 와이프 갤러리의 컨테이너 너비를 무시합니다.

$ (함수() {

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에서 작동하기위한 특정 요구 사항이있는 사람은 누구입니까?

출처

2016-11-28 yavor.vasilev