个人中心
文章发布
退出
作者热门文章
- ubuntu12.04环境下使用kvm ioctl接口实现最简单的虚拟机
- Ubuntu 通过无线网络安装Ubuntu Server启动系统后连接无线网络的方法
- 在Ubuntu上搭建网桥的方法
- ubuntu 虚拟机上网方式及相关配置详解
25
4
CFSDN坚持开源创造价值，我们致力于搭建一个资源共享平台，让每一个IT人在这里找到属于你的精彩世界.
这篇CFSDN的博客文章Javascript实现多彩雪花从天降散落效果的方法由作者收集整理，如果你对这篇文章有兴趣，记得点赞哟.
本文实例讲述了Javascript实现多彩雪花从天降散落效果的方法。分享给大家供大家参考。具体分析如下:
先来看看运行效果，如下图所示:
完整源代码如下:
。
<body> 。
<script type="text/javascript"> var yanhua = "yanhua.jb51.net"; var Fire = function (r, color) { this.radius = r || 12; this.color = color || "FF6600"; this.xpos = 0; this.ypos = 0; this.zpos = 0; this.vx = 0; this.vy = 0; this.vz = 0; this.mass = 1; this.p = document.createElement("span"); this.p.className = "jb"+"51Snow"; this.p.innerHTML = "*"; this.p.style.fontSize = this.radius + "px"; this.p.style.color = "#" + this.color; } Fire.prototype = { append: function (parent) { parent.appendChild(this.p); }, setSize: function (scale) { this.p.style.fontSize = this.radius * scale + "px"; }, setPosition: function (x, y) { this.p.style.left = x + "px"; this.p.style.top = y + "px"; }, setVisible: function (b) { this.p.style.display = b ? "block" : "none"; } } var fireworks = function () { var fires = new Array(); var count = 100; var fl = 250; var vpx = 500; var vpy = 300; var gravity = .3; var floor = 200; var bounce = -.8; var timer; return { init: function () { for (var i = 0; i < count; i++) { var color = 0xFF0000; color = (Math.random() * 0xFFFFFF).toString(16).toString().split(".")[0]; while (color.length < 6) { color = "0" + color; } var fire = new Fire(12, color); fires.push(fire); fire.ypos = -100; fire.vx = Math.random() * 6 - 3; fire.vy = Math.random() * 6 - 3; fire.vz = Math.random() * 6 - 3; fire.append(document.body); } var that = this; timer = setInterval(function () { for (var i = 0; i < count; i++) { that.move(fires[i]); } }, 30); }, move: function (fire) { fire.vy += gravity; fire.xpos += fire.vx; fire.ypos += fire.vy; fire.zpos += fire.vz; if (fire.ypos > floor) { fire.ypos = floor; fire.vy *= bounce; } if (fire.zpos > -fl) { var scale = fl / (fl + fire.zpos); fire.setSize(scale); fire.setPosition(vpx + fire.xpos * scale, vpy + fire.ypos * scale); fire.setVisible(true); } else { fire.setVisible(false); } } } } if (yanhua === 'yanhua.jb' + '51.' + 'net') fireworks().init(),
function jb51Snow() { window.location.reload(); } if (yanhua === 'yanhua.jb' + '51.' + 'net') setInterval(jb51Snow, 6000); </script> 。
</body> </html> 。
。
希望本文所述对大家的javascript程序设计有所帮助.
最后此篇关于Javascript实现多彩雪花从天降散落效果的方法的文章就讲到这里了,如果你想了解更多关于Javascript实现多彩雪花从天降散落效果的方法的内容请搜索CFSDN的文章或继续浏览相关文章，希望大家以后支持我的博客！ 。
25
4
0
我是一名优秀的程序员,十分优秀！