<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>比利王猎场小游戏</title>
<style type="text/css">
#s1 {
overflow: hidden;
}
#s1 img {
height: 100%;
}
#sw {
overflow: hidden;
}
#sw img{
height: 100%;
}
.xd {
height: 40px;
background-color: blue;
width: 40px;
position:absolute;
display: block;
border-radius: 50%;
}
</style>
</head>
<body>
<div style="width: 600px; height: 600px; border: solid 1px red; position: relative;" id="lc">
<div style="height: 40px; background-color: red; width: 40px; position: absolute; border-radius: 50%;" id="s1">
<img src="blw.jpg" />
</div>
<div id="sw" style="height: 40px; background-color: blue; width: 40px; position: absolute; display: none; border-radius: 50%;">
<img src="js/xd2.jpg" />
<div class='xd'>ss</div>
</div>
</div>
<div id="soc" style="width: 100px; height: 100px;"></div>
<input type="button" />
</body>
<script type="text/javascript">
var div=document.getElementsByTagName("div");
var sw=document.getElementById("sw");
var soc=document.getElementById("soc");
var btn=document.getElementsByTagName("input");
var img=document.getElementById("sw").getElementsByTagName("img");
var lc=document.getElementById("lc");
var fx="";
var Lp=1;
var Rp=0;
var Tp=1;
var Bp=0;
var timer;
var zd=20;
var soscer=0;
var times;
var xx=0;
var he=new Array();
he=["xd1.jpg","xd2.jpg","xd3.jpg","xd4.jpg","xd5.jpg","xd6.jpg"];
var fx = "";
//随机数380到0
function suiji() {
return parseInt(Math.random()*(381-0)+0);
}
function suiji2() {
return parseInt(Math.random()*(6));
}
//键盘事件
document.onkeydown=function(event){
event.preventDefault();
var e = event || window.event || arguments.callee.caller.arguments[0];
if(e&&e.keyCode==38)
{
clearInterval(timer);
timer=setInterval(function(){
fx = "top";
Tp++;
sy();
cd();
soc.innerHTML="比利王今天抓了"+soscer+"基佬";
},3);
}
if(e&&e.keyCode==37)
{
clearInterval(timer);
timer=setInterval(function(){
fx = "left";
Lp++;
zy();
cd();
soc.innerHTML="比利王今天抓了"+soscer+"基佬";
},1);
}
if(e&&e.keyCode==40)
{
clearInterval(timer);
timer=setInterval(function(){
fx = "down";
Bp++;
xy();
cd();
soc.innerHTML="比利王今天抓了"+soscer+"基佬";
},3);
}
if(e&&e.keyCode==39)
{
clearInterval(timer);
timer=setInterval(function(){
fx = "right";
Rp++;
yy();
cd();
soc.innerHTML="比利王今天抓了"+soscer+"基佬";
},3);
}
}
//右移
function sy(){
if((Bp-Tp)<0)
{
alert("虚空智障棒棒锤分数"+soscer);
clearInterval(timer);
}
else
div[1].style.top=Bp-Tp+"px";
}
//左移动
function zy(){
if((Rp-Lp)<0)
{
alert("数码暴龙飞射怪分数"+soscer);
clearInterval(timer);
}
else
div[1].style.left=Rp-Lp+"px";
}
//下移
function xy(){
if((Bp-Tp)>560)
{
alert("盲僧莫言闪现q分数"+soscer);
clearInterval(timer);
}
else
div[1].style.top=Bp-Tp+"px";
}
//右移
function yy(){
if((Rp-Lp)>560)
{
alert("太极剑法张三疯分数"+soscer);
clearInterval(timer);
}
else
div[1].style.left=(Rp-Lp)+"px";
}
//分数
function socer(){
console.log("得分了")
soscer++;
}
//随机生成个食物 并记录left top
function sws() {
img[0].src=he[suiji2()];
sw.style.display="block";
pl=this.suiji();
sw.style.left=pl+"px";
pt=this.suiji();
sw.style.top=pt+"px";
// blwzd();
}
//来个东西吃
sws();
//判断吃没有吃到
function cd(){
if((Rp-Lp)<=pl)
{
if((Bp-Tp)<=pt)
{
if(((pl-(Rp-Lp))<=40)&&((pt-(Bp-Tp))<=40))
{
console.log("_=_= 1")
socer();
blwzd();
sws();
}
}
else if((Bp-Tp)>pt)
{
if(((pl-(Rp-Lp))<40)&&(((Bp-Tp)-pt)<40))
{
console.log("_=_= 2")
socer();
blwzd();
sws();
}
}
}
else if((Rp-Lp)>pl)
{
if((Bp-Tp)<=pt)
{
if((((Rp-Lp)-pl)<=40)&&(pt-(Bp-Tp)<=40))
{
console.log("_=_= 3")
socer();
blwzd();
sws();
}
}
else if((Bp-Tp)>pt)
{
if((((Rp-Lp)-pl)<40)&&(((Bp-Tp)-pt)<40))
{
console.log("_=_= 4")
socer();
blwzd();
sws();
}
}
}
}
function blwzd(){
console.log("____");
lc.innerHTML +="<div class='xd'></div>"
var xd=document.getElementsByClassName("xd");
xx++;
var newLeft = 0;
var newTop = 0;
switch(fx){
case "left":
newTop = Bp-Tp;
newLeft = Rp-Lp + 40;
break;
case "right":
newTop = Bp-Tp;
newLeft = Rp-Lp - 40;
break;
case "top":
newTop = Bp-Tp + 40;
newLeft =Rp-Lp;
break;
case "down":
newTop = Bp-Tp - 40;
newLeft = Rp-Lp;
break;
}
console.log(newLeft);
console.log(newTop);
xd[xx].style.left = newLeft + "px";
xd[xx].style.top = newTop + "px";
}
btn[0].onclick=function(){
}
</script>
</html>
分享
