用javascript实现模拟火焰

更新时间：2007年10月03日 22:04:52 作者：

不太像，而且比较耗资原，不知道有没有更好的办法=.=

<html> <head> <title>火焰</title> <script language="JavaScript"> function PixelAxis(left, bottom, width, height, color) {     color = color || "#000000";     var pixels = [];     for(var i = 0; i <= width; i++)     {         pixels[i] = [];         for(var j = 0; j<=height; j++)         {             var img = new Image(1, 1);             img.style.backgroundColor = color;             img.style.position = "absolute";             img.style.left = left + i;             img.style.top = bottom - j;             pixels[i][j] = img;             document.body.appendChild(img);         }     }     return function(x, y, color)     {         pixels[x][y].style.backgroundColor = color;     } } function color(r, g ,b) {     r = r > 0xF ? r.toString(16) : "0" + r.toString(16);     g = g > 0xF ? g.toString(16) : "0" + g.toString(16);     b = b > 0xF ? b.toString(16) : "0" + b.toString(16);     return "#"+r+g+b; } function fireColor(seed) {     return color(seed, Math.floor(0.5*seed), 0); } function spreadSeeds(width, height) {     var pixel = PixelAxis(200, 200, width, height);     var fc = [];     fc[0] = [];     return function()     {         for(var i = 0; i <= width; i++)         {             var s = Math.floor(255 * Math.random());             fc[0][i] = s;             pixel(i, 0, fireColor(s));         }         for(var i = 1; i < height; i++)         {             fc[i] = [];             for(var j = 0; j <= width; j++)             {                 var a = j > 0 ? fc[i-1][j-1] : 0;                 var b = fc[i-1][j];                 var c = j < width ? fc[i-1][j+1] : 0;                 var s = Math.floor((a+b+c)/3);                 //alert(c);                 fc[i][j] = s;                 s = s-Math.floor(i/height*255);                  s = s > 0 ? s : 0;                 pixel(j, i, fireColor(s));             }         }     } } </script> </head> <body bgcolor="#000000"> </body> <script>     var f = spreadSeeds(60, 120);     setInterval("f()",1); </script> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

用javascript实现模拟火焰

初学js插入节点appendChild insertBefore使用方法
由于可见insertBefore()方法的特性是在已有的子节点前面插入新的节点但是两种情况结合起来发现insertBefore()方法插入节点，是可以在子节点列表的任意位置。
2011-07-07
js遍历获取表格内数据的方法(必看)
下面小编就为大家带来一篇js遍历获取表格内数据的方法(必看)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-04-04
JS实现跟随鼠标闪烁转动色块的方法
这篇文章主要介绍了JS实现跟随鼠标闪烁转动色块的方法,涉及javascript操作html元素及css样式的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-02-02
javascript 动态脚本添加的简单方法
下面小编就为大家带来一篇javascript 动态脚本添加的简单方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-10-10
layui按条件隐藏表格列的实例
今天小编就为大家分享一篇layui按条件隐藏表格列的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2019-09-09
JavaScript中0和""比较引发的问题
这篇文章主要介绍了JavaScript中0和""比较引发的问题,非常不错，具有参考借鉴价值，需要的朋友可以参考下
2016-05-05
js实现计时器秒表功能
这篇文章主要为大家详细介绍了js实现计时器秒表功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2019-12-12
JavaScript实现动态数据可视化的示例详解
动态数据可视化能够将大量数据以直观、生动的方式呈现,帮助用户更好地理解和分析数据,本文主要为大家介绍了如何使用JavaScript实现这一功能,需要的可以参考下
2024-02-02
js在Firefox与IE中对DOM对像的引用的比较
直接用ID属性进行引用直接用NAME属性进行引用使用getElementById(),getElementsByName(),getElementsByTagName()进行引用
2009-06-06
r.js来合并压缩css文件的示例
这篇文章主要介绍了r.js来合并压缩css文件的示例代码，在r5下新建一个css文件夹，里面有四个css文件：main.css、nav.css、form.css、grid.css，具体示例代码大家参考下本文
2018-04-04

用javascript实现模拟火焰

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具