2016-05-31 10 views
0

私はJSでユーザが移動した距離を操作したいと思います。携帯電話のクロムについては次のように動作しますが、iOSに切り替えると何も動作しません。私はちょっと掘り下げて、setTimeout()に関する特別なものがモバイル上にあることを発見しましたが、その解決策は機能しませんでした。 setTimeout()を削除すると、すべてがiOS上で動作しますが、動きが速すぎて起動できない場合があります。iOS 9 setTimeout()の問題

window.addEventListener('load', function(){ 


var box1 = document.getElementById('box1'); 
var statusdiv = document.getElementById('statusdiv'); 
var startx = 0; 
var starty = 0; 
var dist = 0; 

box1.addEventListener('touchstart', function(e){ e.preventDefault(); }); 

box1.addEventListener('touchmove', function(e){ 

    var touchobj = e.changedTouches[0]; 

    startx = parseInt(touchobj.clientX); 
    starty = parseInt(touchobj.clientY); 

    setTimeout(function(){ 

     var dist = Math.sqrt(Math.pow(parseInt(touchobj.clientX) - startx,2) + Math.pow(parseInt(touchobj.clientY) - starty,2)); 
     var angleDeg = 180 - Math.atan2((parseInt(touchobj.clientY) - starty) , (parseInt(touchobj.clientX) - startx)) * (180/Math.PI); 
     statusdiv.innerHTML = 'Status: touchmove<br> Horizontal distance traveled: ' + dist + 'px'; 

    } , 50); 

    e.preventDefault(); 

}, false) 


}, false) 

答えて

0

私はこのように私が望んでいたほどにはきれいにしませんでしたが、機能します。私は代わりに間隔で動作するように切り替えました。

window.addEventListener('load', function(){ 


function calc(){ 
    var dist = Math.sqrt(Math.pow(parseInt(touchobj.clientX) - startx,2) + Math.pow(parseInt(touchobj.clientY) - starty,2)); 
    var angleDeg = 180 - Math.atan2((parseInt(touchobj.clientY) - starty) , (parseInt(touchobj.clientX) - startx)) * (180/Math.PI); 
    statusdiv.innerHTML = 'Status: touchmove<br> Horizontal distance traveled: ' + dist + 'px'; 

    startx = parseInt(touchobj.clientX); 
    starty = parseInt(touchobj.clientY); 
} 

var box1 = document.getElementById('box1'); 
var statusdiv = document.getElementById('statusdiv'); 
var startx = 0; 
var starty = 0; 
var dist = 0; 
var intThing; 
var touchobj; 

box1.addEventListener('touchstart', function(e){ 

    intThing = setInterval(calc, 50); 
    e.preventDefault(); 

}); 

box1.addEventListener('touchmove', function(e){ 

    touchobj = e.changedTouches[0]; 

    e.preventDefault(); 

}, false) 

box1.addEventListener('touchend', function(e){ 

    clearInterval(intThing); 
    e.preventDefault(); 

}); 


}, false)