HTML_13_javascript_小游戏_开心消消乐
【摘要】
<!doctype html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" co...
-
<!doctype html>
-
<html lang="en">
-
<head>
-
<meta charset="UTF-8">
-
<meta name="Generator" content="EditPlus®">
-
<meta name="Author" content="">
-
<meta name="Keywords" content="">
-
<meta name="Description" content="">
-
<title>Document</title>
-
-
<style type="text/css">
-
-
#d2{
-
width:100px;
-
height:20px;
-
border:1px solid black;
-
display:inline-block;
-
}
-
-
#d3{
-
display:inline-block;
-
background:red;
-
height:20px;
-
}
-
-
</style>
-
-
<script type="text/javascript">
-
var dsq;
-
var count=0;
-
var n=0;
-
var js;
-
-
function starGame(){
-
window.clearInterval(dsq);
-
window.clearInterval(js);
-
js=window.setInterval("shijian()",1000)
-
dsq=window.setInterval("star()",400);
-
}
-
function star(){
-
var obj=document.createElement("img");
-
obj.src="xingxing.jpg"
-
var w=Math.floor(Math.random()*80+20);
-
obj.width=w;
-
obj.height=w;
-
//随机位置
-
var x=Math.floor(Math.random()*1166+100);
-
var y=Math.floor(Math.random()*500+100);
-
obj.style.position="absolute";
-
obj.style.top=y+"px";
-
obj.style.left=x+"px";
-
document.body.appendChild(obj);
-
obj.οnclick=removeStar;
-
count++;
-
var sp=document.getElementById("d3");
-
d3.style.width=count*5+"px";
-
if(count>=20)
-
{
-
alert("OVER");
-
window.clearInterval(dsq);
-
location.reload();
-
}
-
-
}
-
function removeStar(){
-
this.parentNode.removeChild(this);
-
count--;
-
var sp=document.getElementById("d3");
-
d3.style.width=count*5+"px";
-
}
-
-
function zanting(){
-
alert("STOP");
-
}
-
-
function shijian(){
-
n++;
-
var obj=document.getElementById("d1");
-
obj.innerHTML="已经进行"+n+"秒";
-
-
}
-
-
-
-
</script>
-
-
</head>
-
<body style='cursor:url(http://asp.7i24.com/yhsjxe/book1/images/c2.cur)'>
-
<input type="button" value="开始" οnclick="starGame()">
-
<input type="button" value ="暂停" οnclick="zanting()">
-
<span id="d1">已经进行了0秒</span>
-
<span id="d2"><span id ="d3"> </span></span>
-
-
</body>
-
</html>
文章来源: hiszm.blog.csdn.net，作者：孙中明，版权归原作者所有，如需转载，请联系作者。
原文链接：hiszm.blog.csdn.net/article/details/52987589
【版权声明】本文为华为云社区用户转载文章，如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱：
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论（0）