JavaScriptでどうやって蛇を食べるゲームを作ったらいいですか?02自動走
2978 ワード
<style type="text/css">
*{
margin:0;
padding:0;
list-style: none
}
.divClass{
position:absolute;
width:20px;
height:20px;
background-color:pink;
border-radius:50%;
}
#box{
position:relative;
}
</style>
<div id="box">
<div class="divClass"/>
<div class="divClass"/>
<div class="divClass"/>
<div class="divClass"/>
<div class="divClass"/>
<div class="divClass"/>
<div class="divClass"/>
<div class="divClass"/>
<div class="divClass"> </div>
</div>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<input id="btnRight" type="button" value=" "/>
<input id="btnDown" type="button" value=" "/>
<input id="btnUp" type="button" value=" "/>
<input id="btnLeft" type="button" value=" "/>
<script type="text/javascript" src="js/tools.js"/>
<script type="text/javascript" src="js/moveJS1705.js"/>
<script type="text/javascript">
// （20）
var unitWidth = 20;
var unitHeight = 20;
var direction = " ";
function initUI(){
let divObjs = $("#box").children;
for(let i=0;i<divObjs.length;i++){
divObjs[i].style.left = i*unitWidth+"px";
divObjs[i].style.top = "20px";
}
}
function startGo(){
setInterval(goStep,200);
}
//
function goStep(){
let divObjs = $("#box").children;
for(let i=0;i<divObjs.length-1;i++){
divObjs[i].style.left = divObjs[i+1].style.left;
divObjs[i].style.top = divObjs[i+1].style.top;
}
switch(direction){
case " ":{
//
let left = parseInt(divObjs[divObjs.length-1].style.left);
divObjs[divObjs.length-1].style.left = left-unitWidth+"px";
} break;
case " ":{
//
let top = parseInt(divObjs[divObjs.length-1].style.top);
divObjs[divObjs.length-1].style.top = top-unitHeight+"px";
} break;
case " ":{
//
let left = parseInt(divObjs[divObjs.length-1].style.left);
divObjs[divObjs.length-1].style.left = left+unitWidth+"px";
} break;
case " ":{
//
let top = parseInt(divObjs[divObjs.length-1].style.top);
divObjs[divObjs.length-1].style.top = top+unitHeight+"px";
} break;
default:;
}
}
window.onload = function(){
initUI();
startGo();
}
</script>
</code></pre>
<br/>
<br/>
</div>
</div>
</div>
</div>