ゲームのキーボード操作
11965 ワード
知識点:1、キーボードwindow.eventイベントの受信、IEとfirefox 2、衝突を判断する小さい関数3、コードは韓先生4、index.を参照して一つのファイル、2枚の写真5、div属性、position:absouteに設定します.
<html>
<head>
<meta charset="UTF-8">
<title>title>
<script type="text/javascript">
function move(obj){
var wugui_height=67;
var wugui_width=94;
var tuzi_height=73;
var tuzi_width=76;
var wugui=document.getElementById('wugui');
var tuzi=document.getElementById('tuzi');
if(window.event|| arguments.callee.caller.arguments[0]){
key=obj.keyCode;
}
// top left
var wugui_top=wugui.style.top;
var wugui_left=wugui.style.left;
// px
wugui_top=parseInt(wugui_top.substring(0,wugui_top.indexOf("p")));
wugui_left=parseInt(wugui_left.substring(0,wugui_left.indexOf("p")));
//
if(obj.value==" "||key==83){
wugui.style.top=(wugui_top+10)+"px";
wugui_top=wugui_top+10;
}else if(obj.value==" "||key==68){
wugui.style.left=(wugui_left+10)+"px";
wugui_left=wugui_left+10;
}else if(obj.value==" "||key==65){
wugui.style.left=(wugui_left-10)+"px";
wugui_left=wugui_left-10;
}else if(obj.value==" "||key==87){
wugui.style.top=(wugui_top-10)+"px";
wugui_top=wugui_top-10;
}
// ,
var tuzi_top=tuzi.style.top;
var tuzi_left=tuzi.style.left;
tuzi_top=parseInt(tuzi_top.substring(0,tuzi_top.indexOf("p")));
tuzi_left=parseInt(tuzi_left.substring(0,tuzi_left.indexOf("p")));
y=Math.abs(wugui_top-tuzi_top);
x=Math.abs(wugui_left-tuzi_left);
//
//
xx=0;
yy=0;
//
if(wugui_topif (y1 ;
}
}else{
if(y1;
}
}
//
if(wugui_leftif(x1;
}
}else{
if(x1;
}
}
if(xx==1&&yy==1){
window.alert(" ");
wugui.style.top=120+"px";
wugui.style.left=100+"px";
}
}
script>
head>
<body onkeydown="return move(event)">
<div id="wugui" style="position:absolute ;left:100px;top:120px;" >
<img src="wugui.png" border="1" alt=" " width="94" height="67"/>
div>
<div id="tuzi" style="position:absolute ;left:300px;top:200px;" >
<img src="tuzi.png" border="1" alt=" " width="76" height="73"/>
div>
<table border="1" cellspacing="0" cellpadding="10" width="300">
<tr><th> th><th><input type="button" value=" " onclick="move(this)" />th><th> th>tr>
<tr><td><input type="button" value=" " onclick="move(this)" />td>
<td><input type="button" value=" " onclick="move(this)" />td>
<td><input type="button" value=" " onclick="move(this)" />td>tr>
table>
body>
html>