js_撞球游戏

来源:互联网 发布:淘宝店铺招牌是哪里 编辑:程序博客网 时间:2024/06/07 07:29

小球在你的客户端浏览器不停地运动,碰到边缘后会反弹,基于此可以做出一些很小的网页游戏~

源码:

<html><head><title>撞球游戏</title><script language="javasript" type="text/javascript">function $(id){return document.getElementById(id);}//定两个方向var directX=1;//横向,初始化为1,表示增加var directY=1;//纵向var ballX=0;//小球坐标var ballY=0;var speed=1;//小球速度function move(){ballX+=speed*directX;ballY+=speed*directY;//修改var ball = $("ballDiv");ball.style.left=ballX+"px";ball.style.top=ballY+"px";//判断什么时候改变方向//offsetWidth可以返回当前这个对象的实际宽度if(ball.offsetWidth+ballX>=document.body.clientWidth||ballX<=0){directX= (-1) * directX;}if(ball.offsetHeight+ballY>=document.body.clientHeight||ballY<=0){directY = (-1) * directY;}}function speedUp(){speed++;}setInterval("move()",5);setInterval("speedUp()",10000);//每隔10秒加速</script></head><body style="background-image:url('background.jpg');"><div id="ballDiv" style="position:absolute;"><img src="ball.png"/></div></body></html>

0 0
原创粉丝点击