水平滚动在iPhone ios 9中不起作用

Question

我在带有angularjs移动应用程序的ionic中使用带捏缩放选项的div 。 它在android设备上运行良好，但是在iPhone（iOS 9）上，我无法移动div来查看隐藏的内容。 我可以垂直移动div内容，但不能水平移动。我已经找到了解决方案并实现了样式，

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

但我仍然遇到同样的问题。 有什么解决办法吗？

Answer 1

通过触摸事件使其正常工作。

下面的示例代码，

  $( ".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;        
      }
    }