【编程游戏】贺岁放礼花。（点燃17楼dh20156的焰火）-优快云博客

本文链接：https://blog.youkuaiyun.com/zswang/article/details/3604252

本编程游戏通过JavaScript实现了一个动态的放礼花效果。游戏在网页上随机位置生成烟花爆炸动画，并通过调整元素的位置和大小来模拟烟花升空及绽放的过程。此项目涉及HTML、CSS和JavaScript的基本使用，适合初学者实践。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行] src="http://vote.youkuaiyun.com/VotePostSimple.aspx?voteid=807" marginheight="0" marginwidth="0" scrolling="no" width="100%" frameborder="0" height="400">

<!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" xml:lang="zh-CN" lang="zh-CN">
<head>
<meta http-equiv="Content-Language" content="zh-CN" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>【编程游戏】贺岁放礼花。</title>
</head>
<body>
<script type="text/javascript">
var powder = function(sky,spattern,scolor,astart,aend){
    this.sky = sky;
    this.size = 50;
    this.color = scolor;
    this.start = astart;
    this.end = aend;
    this.times = 20;
    this.steps = 100;
    this.innerHTML = spattern||'●';
    this.style.cssText = 'position:absolute;font-weight:bold;font-family:arial;color:'+scolor+';left:'+this.start[0]+'px;top:'+this.start[1]+';font-size:'+this.size+'px;';
    this.go = function(){
        var op = this,sky = this.sky;color = this.color,size = this.size,startX = this.start[0],startY = this.start[1],endX = this.end[0],endY = this.end[1],steps = this.steps;
        var dx = endX - startX;
        var dy = endY - startY;
        var curStep = 0;
        var flash = function(){
            if(!sky){return;}
            var sbg = sky.style.background = color;
            window.setTimeout(function(){sky.style.background = 'black';sky.removeChild(op);});
        };
        var move = function(){
            curStep++;
            if(curStep>steps){
                window.clearInterval(timer);
                flash();
                return;
            }
            var sx = dx*curStep/steps,sy = dy*curStep/steps,ss = size*curStep/steps;
            op.style.left = (startX + sx) + "px";
            op.style.top = (startY + sy) + "px";
            op.style.fontSize = (size - ss) + "px";
        }
        var timer = window.setInterval(move,this.times);
    };
};