0
iOS 웹 앱에서 일부 자바 스크립트 코드로 약간의 무게를 뚫고 있습니다.iOS에서 자이로 스코프 이동 및 터치 이동에 대한 JavaScript가 충돌합니다. 두 번째 부품이 사용 중일 때 부품을 일시 중지하려면 어떻게해야합니까?
내가 사용하여 다른 레이어 위에 레이어를 이동하고 있어요 :
- 자이로와 가속도계 데이터와
- 터치 입력을.
이것은 두 가지 자바 스크립트가 동일한 것을 이동하려고한다는 것을 의미합니다. 이것은 iOS 장치에서 볼 때 as you can see from the current version을 볼 때 잘 작동하지 않습니다 (힌트 : 오른쪽의 버튼으로 투명도가 켜져 있고 아니오, 마우스로 이동할 수없고 움직이지 않을 것입니다. 자이로와 iOS 장치 사용).
저는 힘든 부분을 다뤘지만 자바 스크립트를 능숙하게 사용할 수있는 수준에 기반한 잡았다 고 생각합니다.
터치 - 이동 코드가 활성화되어있을 때 어떻게 자이로 - 이동 코드를 멈출 수 있습니까? 또한 터치 이동이 끝나면 투명도가 점프하지 않도록 x + y 값을 업데이트해야 할 것입니다.
코드 상단에 if, else 문을 추가하려고 시도했지만 전체적으로 많은 부분이 손상된 것 같습니다.
감사합니다. StackOverflow의 모든 분들께 감사드립니다. 이전 Q와 As는 지금까지 나를 도와 주는데 많은 도움이되었습니다.
도움을 받으실 수 있습니다.
스테판
여기 것
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();