2016-03-02 1 views
0

Я использую div с возможностью масштабирования зума с ионным приложением с угловым мобильным приложением. Он отлично работает на устройстве Android, но на iPhone (iOS 9) я не могу переместить div, чтобы увидеть скрытый контент. Я в состоянии переместить div содержимое по вертикали, но не horizontally.I've искали решения и реализовать стиль,Горизонтальная прокрутка не работает в iPhone ios 9

-webkit-overflow-scrolling: touch; 
overflow-y: scroll; 
overflow-x: scroll; 

но у меня все тот же вопрос. Есть ли решение для этого?

ответ

0

Получил работу от сенсорных событий.

Пример кода ниже,

$(".pinch").on("touchstart", fingerDown) 
       .on('touchend', fingerUp) 
       .on('touchmove', fingerMove) 
       .on('touchend', fingerend); 


    var startX = 0; 
    var endX = 0; 
    var lastMargin = 0; 
    var leftMargin = 0; 

    function fingerend(e){       
    lastMargin = leftMargin; 
    leftMargin = 0;   
    } 

    function fingerMove(e){   
    var tempEndX = 0;   
    var tempLeftMargin = 0; 
    tempEndX = e.originalEvent.touches[0].pageX;   

    if(startX > tempEndX){ 
     tempLeftMargin = -(startX - tempEndX); 
    }else{ 
     tempLeftMargin = tempEndX - startX; 
    } 

    tempLeftMargin = tempLeftMargin + lastMargin; 
    var deltaVal = $("#my-div").children().width(); 
    var minVal = -(deltaVal - 280); 
    var maxVal = 10; 

    if(tempLeftMargin > minVal && tempLeftMargin < maxVal){ 
     $("#my-div").children().css({ 
      "margin-left": tempLeftMargin    
     }); 

     endX = tempEndX; 
     leftMargin = tempLeftMargin; 
    }  
    } 

    function fingerDown(e){ 
     console.log("fingerdown "+e.originalEvent.touches.length); 
     var fingersDown = e.originalEvent.touches.length; 
     if (fingersDown > 1) {    
     toggleHammerScrolling(true); 
     }else{ 
     startX = e.originalEvent.touches[0].pageX;   
     } 
    }