日期:2014-05-17  浏览次数:20728 次

很奇怪的现象,帮忙看下
向上和向左可以移动,可是为什么向右和向下不能移动呢?????
html code:

<html>
<head>
<title>SuperMary Game</title>
<link href="superMary.css" type="text/css" rel="stylesheet"/>
<script language="javascript" src="superMary.js"></script>
<script language="javascript" type="text/javascript">
function Mary(){
this.x=0;
this.y=0;

this.move=function(direct){
switch(direct){
case 0:
var mymary=document.getElementById('mymary');
var top=mymary.style.top;
top=parseInt(top.substr(0,top.length-2));
mymary.style.top=top-10;
break;
case 1:
var mymary=document.getElementById('mymary');
var right=mymary.style.right;
right=parseInt(right.substr(0,right.length-2));
mymary.style.right=(right)+10;
break;
case 2:
var mymary=document.getElementById('mymary');
var buttom=mymary.style.buttom;
buttom=parseInt(buttom.substr(0,buttom.length-2));
mymary.style.buttom=(buttom)+10;
break;
case 3:
var mymary=document.getElementById('mymary');
var left=mymary.style.left;
left=parseInt(left.substr(0,left.length-2));
mymary.style.left=(left)-10;
break;
}
}
}

//创建对象
var mary=new Mary();

function maryMove(direct){
switch(direct){
case 0:
mary.move(direct);
break;
case 1:
mary.move(direct);
break;
case 2:
mary.move(direct);
break;
case 3:
mary.move(direct);
break;
}
}
</script>
</head>
<body>
<div class="divbox">
<img id="mymary" style="left:200px;top:200px;position:absolute;" src="my.jpg" width="50px" height="35px"/>
</div>
<table class="control" border="2px" >
<tr align="center"><td colspan="3">游戏控制键</td></tr>
<tr align="center"><td>**</td><td><input type="button" value="↑" onclick="maryMove(0)"/></td><td>**</td></tr>
<tr align="center"><td><input type="button" value="←" onclick="maryMove(3)"/></td><td>**</td><td><input type="button" value="→" onclick="maryMove(1)"/></td></tr>
<tr align="center"><td>**</td><td><input type="button" value="↓" onclick="maryMove(2)"/></td><td>**</td></tr>
</table>
</body>
</html>



CSS code:

.divbox{
background-color:red;
width:450px;
height:450px;
}

.control{
width:200px;
height:100px;
border:1px solid blue;
}

------解决方案--------------------
top-10 和(buttom)+10; (right)+10 和(left)-10;这两组表示不同但效果一样 不是只觉得了两个方向的运动吗 是不是这里有问题的说。。。
------解决方案--------------------
哎呀。。不好意思打错字了~~ 只决定了两个方向的运动 不是觉得 原谅原谅哈 ~~
------解决方案--------------------
你如果确定向上和向左可以用的话,那么你只需改



case 1:
 var mymary=document.getElementById('mymary');
 var right=mymary.style.right;
 right=parseInt(right.substr(0,right.length-2));
 mymary.style.right=(right)+10;
 break;
改为
case 1:
 var mymary=document.getElementById('mym