iOS上陀螺仪移动和触摸移动的JavaScript存在冲突，当第二部分正在使用时，我如何暂停其中一部分

我在iOS网络应用程序上使用了一些JavaScript代码，这有点超出了我的体重。

我正在做的是使用将一层移动到另一层之上

1. 陀螺仪和加速度计数据以及
2. 触摸输入

这意味着我有两个javascript，它们都试图移动同一个东西。当你在iOS设备上查看时，你可以从当前版本中看到，这效果不太好（提示：透明度是用右边的按钮打开的，不，它现在不能用鼠标移动，除非你使用带陀螺仪的iOS设备，否则不会移动）。

所以我已经完成了一些困难的部分，但我坚持认为，基于我对JavaScript的新手熟练程度，我会找到一个解决方案。

触摸移动代码激活时，如何停止陀螺仪移动代码？此外，我想我需要更新x+y值，这样一旦触摸移动结束，透明度就不会跳到位置。

我试着在代码的顶部添加一个if，else语句，但这似乎打破了很多。

顺便说一句，感谢StackOverflow上的每一个人，之前的Q和A为我走到这一步提供了大量帮助。

我们将不胜感激。

Stefan

到目前为止，这是我的代码，它生活在身体元素中。。。

var x = 0, y = 0,
    vx = 0, vy = 0,
    ax = 0, ay = 0;
var transp = document.getElementById("transp");
if (window.DeviceMotionEvent != undefined) {
    window.ondevicemotion = function(e) {
        ax = event.accelerationIncludingGravity.x * 5;
        ay = event.accelerationIncludingGravity.y * 5 + 19;
        document.getElementById("accelerationX").innerHTML = e.accelerationIncludingGravity.x;
        document.getElementById("accelerationY").innerHTML = e.accelerationIncludingGravity.y;
        document.getElementById("accelerationZ").innerHTML = e.accelerationIncludingGravity.z;
        if ( e.rotationRate ) {
            document.getElementById("rotationAlpha").innerHTML = e.rotationRate.alpha;
            document.getElementById("rotationBeta").innerHTML = e.rotationRate.beta;
            document.getElementById("rotationGamma").innerHTML = e.rotationRate.gamma;
        }       
    }
    setInterval( function() {
        var landscapeOrientation = window.innerWidth/window.innerHeight > 1;
        if ( landscapeOrientation) {
            vx = vx + ay;
            vy = vy + ax;
        } else {
            vy = vy - ay;
            vx = vx + ax;
        }
        vx = vx * 0.98;
        vy = vy * 0.98;
        y = parseInt(y + vy / 70);
        x = parseInt(x + vx / 70);
        boundingBoxCheck();
        transp.style.top = y + "px";
        transp.style.left = x + "px";
    }, 25);
} 

function boundingBoxCheck(){
    if (x<-310) { x = -310; vx = -vx; }
    if (y<-300) { y = -300; vy = -vy; }
    if (x>document.documentElement.clientWidth) { x = document.documentElement.clientWidth; vx = -vx; }
    if (y>document.documentElement.clientHeight+400) { y = document.documentElement.clientHeight+400; vy = -vy; }
}
    $.fn.moveable = function() {  
      var offset = null;  
      var start = function(e) {  
        var orig = e.originalEvent;  
        var pos = $(this).position();  
        offset = {  
          x: orig.changedTouches[0].pageX - pos.left,  
          y: orig.changedTouches[0].pageY - pos.top  
        };  
      };  
      var moveMe = function(e) {  
        e.preventDefault();  
        var orig = e.originalEvent;  
        $(this).css({  
          top: orig.changedTouches[0].pageY - offset.y,  
          left: orig.changedTouches[0].pageX - offset.x  
        });  
      };  
      this.bind("touchstart", start);  
      this.bind("touchmove", moveMe);  
    };  
    $(".moveable").moveable();