嗨,我正在 ipad 中构建一个应用程序,我有对象,当我移动 ipad 时,甚至对象应该使用加速度计功能移动。但是当我使用下面的代码时,它没有进入Mobeobject()
功能内部,我可能知道我哪里出错了。
我的对象没有移动。
// Start moving the object
var startMove = $('#startMove');
startMove.live("click",function()
{
alert("startMoving>>");
startMoving();
$(this).hide();
});
// Start watching the acceleration
function startMoving(){
alert("startMoving");
var options = { frequency: 500 };
alert("insidestartMoving");
watchMove = navigator.accelerometer.watchAcceleration(moveObject, onError, options);
alert("instartMoving");
}
// moveObject
function moveObject(acceleration) {
alert("moveObject");
var myObj = $('#obj');
var wall = $('#obj_wall');
var objPosition = myObj.position();
var leftBoundary = 0;
var topBoundary = 0;
var rightBoundary = wall.width() - myObj.width() - 10; // 10 represents the 10px for the margin
var bottomBoundary = wall.height() - myObj.height() - 10; // 10 represents the 10px for the margin
if( acceleration.x < 0 && objPosition.left <= rightBoundary ) {
myObj.animate({
left:'+=10'
},100);
} else if( acceleration.x > 0 && objPosition.left > leftBoundary ) {
myObj.animate({
left:'-=10'
},100);
}
if( acceleration.y < 0 && objPosition.top > topBoundary ) {
myObj.animate({
top:'-=10'
},100);
} else if(acceleration.y > 0 && objPosition.top <= bottomBoundary ) {
myObj.animate({
top:'+=10'
},100);
}
}
<!DOCTYPE html>
<html>
<head>
<title></title>
<body>
<div data-role="page">
<div data-role="content">
<div id="obj_wall">
<div id="obj"></div>
</div>
<div>
<a href="#" id="startMove" data-role="button">Start Moving</a>
</div>
</div>
</div>
开始移动