1顶

非常漂亮的烟花特效

稿源：互联网 2022-06-11 18:05:54 点击： 1293 撤稿纠错

夜空烟花，好看不需要理由！可以拿来泡妞~

以下讨论的是和特效页面特效相关的非常漂亮的烟花特效教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<!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=gb2312" /> <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 Fireworks(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 = 90; this.angle = 45; this.num = 16; this.loop = loop; this.degree = 2; this.t = 0; this.delt = 0; this.max = 30; this.cur = 1; this.points = null; } Fireworks.prototype = { init : function(){ this.x = parseInt(this.skyWidth/1.3 * Math.random()) + this.skyWidth / 8; this.y = this.skyHeight; this._y = parseInt((this.skyHeight / 4) * Math.random()) + this.skyHeight / 5; }, setOpacity : function(obj, p){ if(p > 85){ var opacity = 100 - (p - 85) * 4; if(document.all){ obj.style.filter = "alpha(opacity=" + opacity + ")"; }else{ obj.style.MozOpacity = opacity / 100; } } }, getNextPoint : function(degree, coeff, t){ var tt = 1.0 - t; for(var rr = 1; rr <= degree; rr++){ for(var i=0; i <= degree-rr; i++){ coeff[i] = tt * coeff[i] + t * coeff[i+1]; } } return coeff[0]; }, showBall : function(){ this.ball = document.createElement("div"); this.ball.innerHTML = "●"; this.ball.className = "ball"; this.ball.style.left = this.x + "px"; this.ball.style.top = this.y + "px"; this.sky.appendChild(this.ball); }, moveBall : 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.moveBall();}, this.delay); }else{ this.fire(); } }, hideBall : function(){ this.sky.removeChild(this.ball); this.ball = null; }, showStars : function(){ var colors = ['#FF0000','#FF00FF','#00FF00','#00FFFF','#FFFF00','#FF0000','#FF00FF','#00FF00','#00FFFF','#FFFF00']; var n = cs = parseInt(Math.random() * colors.length / 2); var cc = parseInt(Math.random() * colors.length / 2); var colorMode = parseInt(Math.random() * 2); var star = Math.round(Math.random()) == 1 ? "★" : "☆"; this.r = 10; this.radius = Math.round(Math.random() * 30) + 60; this.num = Math.round(Math.random() * 5 + 5) * 2; this.angle = 180 / this.num * 2; for(var i=1; i<=this.num; i++){ this.stars[i] = document.createElement("div"); this.stars[i].innerHTML = star; this.stars[i].className = "star"; if(colorMode == 1){ this.stars[i].style.color = colors[n]; if(++n > cs + cc) n = cs; }else{ 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; p = parseInt(this.r / this.radius * 100); for(var i=1; i<=this.num; i++){ this.stars[i].style.left = this.x - Math.round(this.r * Math.sin(Math.PI - (Math.PI / 180 * this.angle * i))) + "px"; this.stars[i].style.top = this.y - Math.round(this.r * Math.cos(Math.PI - (Math.PI / 180 * this.angle * i))) + "px"; this.stars[i].style.fontSize = 4 + p/10 + "px"; this.setOpacity(this.stars[i], p); } setTimeout(function(){self.moveStars();}, this.delay); }else{ setTimeout(function(){self.hideStars();}, 200 * Math.random()); } }, initBezier : function(){ var coeff_x = []; var coeff_y = []; this.points = []; this.t = 0; this.delt = 1.0 / this.max; this.cur = 1; var a = parseInt(Math.random() * 5) * 90; coeff_x[0] = this.x; coeff_y[0] = this.y; for(var i=1; i<=this.num; i++){ coeff_x[1] = this.x + Math.sin(Math.PI - (Math.PI / 180 * this.angle * i)) * this.radius/2; coeff_y[1] = this.y + Math.cos(Math.PI - (Math.PI / 180 * this.angle * i)) * this.radius/2; coeff_x[2] = this.x + Math.sin(Math.PI - (Math.PI / 180 * (a-this.angle * i))) * this.radius; coeff_y[2] = this.y + Math.cos(Math.PI - (Math.PI / 180 * (a-this.angle * i))) * this.radius; this.points[(i-1)*2] = coeff_x.slice(0); this.points[(i-1)*2+1] = coeff_y.slice(0); } }, moveStars2 : function(){ var self = this; if(this.cur < this.max){ this.t += this.delt; this.cur++; p = parseInt(this.cur / this.max * 100); for(var i=1; i<=this.num; i++){ this.stars[i].style.left = this.getNextPoint(this.degree, this.points[(i-1)*2], this.t) + "px"; this.stars[i].style.top = this.getNextPoint(this.degree, this.points[(i-1)*2+1], this.t) + "px"; this.stars[i].style.fontSize = 4 + p/10 + "px"; this.setOpacity(this.stars[i], p); } setTimeout(function(){self.moveStars2();}, this.delay); }else{ setTimeout(function(){self.hideStars();}, 200 * Math.random()); } }, hideStars : function(){ for(var i=1; i<=this.num; i++){ this.sky.removeChild(this.stars[i]); this.stars[i] = null; if(this.points != null){ delete this.points[(i-1)*2]; delete this.points[(i-1)*2+1]; } } if(this.points){ delete this.points; } this.points = null; if(this.loop){ this.play(); } }, fire : function(){ this.hideBall(); this.showStars(); var effect = parseInt(Math.random() * 2) + 1; switch(effect){ case 1: this.moveStars(); break; case 2: this.initBezier(); this.moveStars2(); break; } }, play : function(){ this.init(); this.showBall(); this.moveBall(); } }; window.onload = function(){ for(var i=0; i<5; i++) new Fireworks(document.body, true).play(); }; </script> </head> <body> </body> </html> <a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a>[/html]
以下是HTML网页特效代码，点击运行按钮可查看效果：[html]<html> <head> <title></title> </head> <body bgcolor="#000000" text="#FFFFFF"> </body> <script languate="VBScript" type="text/VBScript"> Dim pubOrbits_X(15, 255) Dim pubOrbits_Y(15, 255) Dim pubSpanObjects(15, 15) Dim pubColors(15, 15) Dim pubStepOn Dim pubStepOnB Dim pubWorkOn Dim pubX Dim pubY Dim pubScale Dim pubTime Sub window_onload() CreateObjects CreateColors CreateOrbits pubOrbits_X, pubOrbits_Y NewSkyrocket ShowSkyrocket End Sub Sub NewSkyrocket() pubX=Int(Rnd * 640) pubY=Int(Rnd * 100)+480 pubScale = Rnd * 1 + 1 pubStepOn = 21 pubStepOnB = 21 pubTime = window.setTimeout("ShowSkyrocket", 1) End Sub Sub ShowSkyrocket() If pubStepOn > 1 Then pubStepOn = pubStepOn - 1 If pubStepOnB > 1 Then pubStepOnB = pubStepOnB - 1 Else pubStepOnB = pubStepOnB - 0.1 End If pubY=pubY - (pubStepOnB * pubScale) If pubWorkOn < 256 Then pubWorkOn = pubWorkOn + pubStepOn ViewObjects pubScale, pubWorkOn, pubX, pubY pubTime = window.setTimeout("ShowSkyrocket", 1) Else pubWorkOn = 0 ViewObjects pubScale, pubWorkOn, pubX, pubY NewSkyrocket End If End Sub Sub ViewObjects(pScale, pIndex, pX, pY) If pIndex < 256 And pIndex > 15 Then For tIndexA = 0 To 15 For tIndexB = 0 To 14 With pubSpanObjects(tIndexA,tIndexB).style .top = pubSpanObjects(tIndexA,tIndexB + 1).style.top .left = pubSpanObjects(tIndexA,tIndexB + 1).style.left End With Next With pubSpanObjects(tIndexA,15).style .top = pubOrbits_Y(tIndexA, pIndex) * pScale + pY .left = pubOrbits_X(tIndexA, pIndex) * pScale + pX End With For tIndexB = 0 To 15 With pubSpanObjects(tIndexA,tIndexB).style .color = pubColors(tIndexA, tIndexB) End With Next Next End If End Sub Sub CreateObjects() For tIndexA = 0 To 15 For tIndexB = 0 To 15 Set pubSpanObjects(tIndexA, tIndexB) = document.createElement("SPAN") With pubSpanObjects(tIndexA, tIndexB) .innerText = "." End With With pubSpanObjects(tIndexA, tIndexB).style .position = "absolute" .color = Rgb(0, 0, 0) End With idInsertObject.insertAdjacentElement "beForeEnd", pubSpanObjects(tIndexA, tIndexB) Next Next End Sub Sub CreateColors() Dim tColor(2) For tColorIndex = 0 To 15 tColor(0) = Rnd : tColor(1) = Rnd : tColor(2) = Rnd tColor(Int(Rnd*3)) = 1 tLightLen = Int(rnd * 50) + 50 For tLightIndex = 0 To 15 tLightValue = tLightIndex * 255 / 15 pubColors(tColorIndex, tLightIndex)=rgb(tColor(0)*tLightValue, tColor(1)*tLightValue, tColor(2)*tLightValue) Next Next End Sub Sub CreateOrbits(pOrbits_X(), pOrbits_Y()) For tOrbitsIndex = 0 To 15 tAxis_R = Int(Rnd * 50) + 50 tAxis_XY = Int(Rnd * 360) tAxis_YZ = Int(Rnd * 360) tAxis_ZX = Int(Rnd * 360) For tLightIndex = 0 To 255 tAxis_ZX = tAxis_ZX + 2 '(tAxis_ZX + 0.5) Mod 360 GetOrbits tAxis_XY, tAxis_YZ, tAxis_ZX, tAxis_R * tLightIndex / 255, tOrbits_X, tOrbits_Y pOrbits_X(tOrbitsIndex, tLightIndex) = tOrbits_X pOrbits_Y(tOrbitsIndex, tLightIndex) = tOrbits_Y Next Next End Sub Sub GetOrbits(pAxis_XY, pAxis_YZ, pAxis_ZX, pAxis_R, pOrbits_X, pOrbits_Y) tAxis_XY = RadianGetByAngle(pAxis_XY) tAxis_YZ = RadianGetByAngle(pAxis_YZ) tAxis_ZX = RadianGetByAngle(pAxis_ZX) pOrbits_X = pAxis_R * Cos(tAxis_XY) * Cos(tAxis_ZX) pOrbits_Y = pAxis_R * Sin(tAxis_XY) * Sin(tAxis_YZ) End Sub Function RadianGetByAngle(pAngle) RadianGetByAngle =pAngle * 3.1415926 / 180 End Function </script> </html> <a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a>

关于非常漂亮的烟花特效的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/200901053992.shtml方便下次再访问哦。

·上一篇： 新年烟花来咯~烟花特效
·下一篇： WEB版敲砖头游戏

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

非常漂亮的烟花特效

文章分类LIST >>返回首页

最新游戏

最新新闻