您的位置:首页 > 编程语言

【编程游戏】贺岁放礼花。(点燃60楼Free_Wind22的焰火)

2008-12-26 21:27 465 查看
function viewPage(html) {
var page = window.open('', '', '');
page.opener = null;
page.document.write(html);
page.document.close();
}

【编程游戏】贺岁放礼花。(第一名奖励10000可用分)
作者:


点燃 [Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>【编程游戏】贺岁放礼花 -- freewind</title>
<style type="text/css">
html, body{background:#000; height:100%; margin:0px; padding:0px;color:#FFF;}
.ball{color:#FF0000; position:absolute; font-size:16px;}
.star{color:#FF0000; position:absolute; font-size:4px;}
</style>
<script type="text/javascript">
function Firework(sky, loop){
this.sky = sky;
this.skyWidth = document.body.clientWidth || document.documentElement.clientWidth;
this.skyHeight= document.body.clientHeight || document.documentElement.clientHeight;
this.x = this.y = 0;
this.step = 20;
this.delay = 30;
this.stars = [];
this.r = 10;
this.step2 = 7;
this.radius = 80;
this.angle = 45;
this.num = 16;
this.loop = loop;
}
Firework.prototype = {
init : function(){
this.x = parseInt(this.skyWidth/2 * Math.random()) + this.skyWidth / 4;
this.y = this.skyHeight;
this._y = parseInt((this.skyHeight / 4) * Math.random()) + this.skyHeight / 5;
},
show : function(){
var b = document.createElement("div");
b.innerHTML = "●";
b.className = "ball";
b.style.left = this.x + "px";
b.style.top = this.y + "px";
this.ball = b;
this.sky.appendChild(this.ball);
},
hide : function(){
this.sky.removeChild(this.ball);
this.ball = null;
},
hideStars : function(){
for(var i=1; i<=this.num; i++){
this.sky.removeChild(this.stars[i]);
this.stars[i] = null;
}
if(this.loop){
this.play();
}
},
setStarPos : function(){
for(var i=1; i<=this.num; i++){
var p = parseInt(this.r / this.radius * 10);
this.stars[i].style.left = this.x - parseInt(this.r * Math.sin(i * this.angle)) + "px";
this.stars[i].style.top = this.y - parseInt(this.r * Math.cos(i * this.angle)) + "px";
this.stars[i].style.fontSize = 4 + p + "px";
}
},
showStars : function(){
var angles = [15, 30, 45, 60];
var maxs = [20, 12, 6, 10];
var colors = ['#FF0000','#FF00FF','#00FF00','#00FFFF','#FFFFF0'];
var rand = parseInt(Math.random() * maxs.length);
this.r = 10;
this.num = maxs[rand];
this.angle = angles[rand];
for(var i=1; i<=this.num; i++){
this.stars[i] = document.createElement("div");
this.stars[i].innerHTML = "★";
this.stars[i].className = "star";
this.stars[i].style.color = colors[parseInt(Math.random()*colors.length)];
this.sky.appendChild(this.stars[i]);
}
},
moveStars : function(){
var self = this;
if(this.r < this.radius){
var p = this.step2 - parseInt(this.r / this.radius * 5);
p = p < 1 ? 1 : p;
this.r += p;
this.setStarPos();
setTimeout(function(){self.moveStars();}, this.delay);
}else{
setTimeout(function(){self.hideStars();}, 300 * Math.random());
}
},
fire : function(){
this.hide();
this.showStars();
this.moveStars();
},
move : function(){
var self = this;
if(this.y > this._y){
var p = parseInt((this.skyHeight - this.y) / (this.skyHeight - this._y)*10);
this.y -= (this.step - p * 1.6);
this.ball.style.fontSize = 16 - p + "px";
this.ball.style.top = this.y + "px";
setTimeout(function(){self.move();}, this.delay);
}else{
this.fire();
}
},
play : function(){
this.init();
this.show();
this.move();
}
};

window.onload = function(){
new Firework(document.body, true).play();
new Firework(document.body, true).play();
new Firework(document.body, true).play();
};
</script>
</head>

<body>
</body>
</html>

点燃 [Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐