欧美阿v视频在线大全_亚洲欧美中文日韩V在线观看_www性欧美日韩欧美91_亚洲欧美日韩久久精品

主頁(yè) > 知識(shí)庫(kù) > html5使用canvas實(shí)現(xiàn)跟隨光標(biāo)跳動(dòng)的火焰效果

html5使用canvas實(shí)現(xiàn)跟隨光標(biāo)跳動(dòng)的火焰效果

熱門(mén)標(biāo)簽:百度地圖標(biāo)注為什么總是封號(hào) 400開(kāi)頭的電話好申請(qǐng)不 咸陽(yáng)穩(wěn)定外呼系統(tǒng)軟件 地圖標(biāo)注柱狀圖 四川移動(dòng)電銷(xiāo)外呼客戶管理系統(tǒng) 小朱地圖標(biāo)注 智能芯電話機(jī)器人 臨海地圖標(biāo)注app 怎么做百度地圖標(biāo)注

本效果的完整代碼如下,把代碼保存到HTML文件中打開(kāi)也能查看效果,火焰會(huì)跟隨光標(biāo):

復(fù)制代碼
代碼如下:

<!DOCTYPE HTML>
<head>
<meta charset=utf-8" />
<title>HTML5 Canvas火焰效果</title>
<style type="text/css">
body{margin: 0; padding: 0;}
#canvas-keleyi-com {display: block;}
</style>
</head>
<body>
<canvas id="canvas-keleyi-com"></canvas>
<script type="text/javascript">
window.onload = function(){
var keleyi_canvas = document.getElementById("canvas-kel"+"eyi-com");
var ctx = keleyi_canvas.getContext("2d");
var W = window.innerWidth, H = window.innerHeight;
keleyi_canvas.width = W;
keleyi_canvas.height = H;</p> <p>var particles = [];
var mouse = {};</p> <p>//Lets create some particles now
var particle_count = 100;
for(var i = 0; i < particle_count; i++)
{
particles.push(new particle());
}
keleyi_canvas.addEventListener('mousemove', track_mouse, false);</p> <p>function track_mouse(e)
{
mouse.x = e.pageX;
mouse.y = e.pageY;
}</p> <p>function particle()
{
this.speed = {x: -2.5+Math.random()*5, y: -15+Math.random()*10};
//location = mouse coordinates
//Now the flame follows the mouse coordinates
if(mouse.x && mouse.y)
{
this.location = {x: mouse.x, y: mouse.y};
}
else
{
this.location = {x: W/2, y: H/2};
}
//radius range = 10-30
this.radius = 10+Math.random()*20;
//life range = 20-30
this.life = 20+Math.random()*10;
this.remaining_life = this.life;
//colors
this.r = Math.round(Math.random()*255);
this.g = Math.round(Math.random()*255);
this.b = Math.round(Math.random()*255);
}</p> <p>function draw()
{
ctx.globalCompositeOperation = "source-over";
ctx.fillStyle = "black";
ctx.fillRect(0, 0, W, H);
ctx.globalCompositeOperation = "lighter";</p> <p>for(var i = 0; i < particles.length; i++)
{
var p = particles[i];
ctx.beginPath();
p.opacity = Math.round(p.remaining_life/p.life*100)/100
var gradient = ctx.createRadialGradient(p.location.x, p.location.y, 0, p.location.x, p.location.y, p.radius);
gradient.addColorStop(0, "rgba("+p.r+", "+p.g+", "+p.b+", "+p.opacity+")");
gradient.addColorStop(0.5, "rgba("+p.r+", "+p.g+", "+p.b+", "+p.opacity+")");
gradient.addColorStop(1, "rgba("+p.r+", "+p.g+", "+p.b+", 0)");
ctx.fillStyle = gradient;
ctx.arc(p.location.x, p.location.y, p.radius, Math.PI*2, false);
ctx.fill();</p> <p>
p.remaining_life--;
p.radius--;
p.location.x += p.speed.x;
p.location.y += p.speed.y;</p> <p>if(p.remaining_life < 0 || p.radius < 0)
{
particles[i] = new particle();
}
}
}</p> <p>setInterval(draw, 86);
}
</script>
</body>
</html>

標(biāo)簽:南平 山南 黃石 平頂山 黃石 公主嶺 陜西

巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《html5使用canvas實(shí)現(xiàn)跟隨光標(biāo)跳動(dòng)的火焰效果》,本文關(guān)鍵詞  html5,使用,canvas,實(shí)現(xiàn),跟隨,;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問(wèn)題,煩請(qǐng)?zhí)峁┫嚓P(guān)信息告之我們,我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無(wú)關(guān)。
  • 相關(guān)文章
  • 下面列出與本文章《html5使用canvas實(shí)現(xiàn)跟隨光標(biāo)跳動(dòng)的火焰效果》相關(guān)的同類信息!
  • 本頁(yè)收集關(guān)于html5使用canvas實(shí)現(xiàn)跟隨光標(biāo)跳動(dòng)的火焰效果的相關(guān)信息資訊供網(wǎng)民參考!
  • 推薦文章
    欧美阿v视频在线大全_亚洲欧美中文日韩V在线观看_www性欧美日韩欧美91_亚洲欧美日韩久久精品
  • <rt id="w000q"><acronym id="w000q"></acronym></rt>
  • <abbr id="w000q"></abbr>
    <rt id="w000q"></rt>
    国产一区二区三区av电影| 精品国产视频在线观看| 欧美另类z0zxhd电影| 亚洲美女偷拍久久| 99这里都是精品| 一本色道久久加勒比精品| 中文字幕精品综合| 国产福利91精品| 青青操在线视频观看| 亚洲国产电影在线观看| 国产成人午夜片在线观看高清观看| 亚洲一区 欧美| 久久精品视频在线看| 国产麻豆91精品| 伊人久久久久久久久久久久久久| 中文字幕欧美日本乱码一线二线| 国产成人免费网站| 伦理电影国产精品| 少妇av片在线观看| 国产日韩欧美精品在线| 国产精品1区二区.| 青青青在线免费观看| 亚洲免费观看高清完整版在线观看熊| av网站免费线看精品| 欧美日韩一区二区三区视频 | 欧美大胆一级视频| 麻豆精品在线看| 黑人と日本人の交わりビデオ| 久久久久综合网| 成人晚上爱看视频| 欧美亚洲另类激情小说| 午夜视频一区在线观看| 久久精品一区二区免费播放| 久久蜜桃香蕉精品一区二区三区| 国产福利精品一区| 在线区一区二视频| 日欧美一区二区| 变态另类ts人妖一区二区| 国产精品国产a级| 亚洲乱妇老熟女爽到高潮的片| 日韩午夜激情免费电影| 精品一区二区三区欧美| 欧美三级黄色大片| 亚洲国产一区视频| 国产中年熟女高潮大集合| 国产精品青草综合久久久久99| 91一区二区三区在线观看| 欧美精品色一区二区三区| 日本成人在线看| 一级片一级片一级片| 亚洲一区二区视频在线| 亚洲第一成人网站| 国产精品国产a| 午夜一区二区三区免费| 中文字幕久久午夜不卡| 亚洲一区和二区| 久久久精品蜜桃| 乳色吐息在线观看| 久久综合九色综合欧美亚洲| 99精品在线观看视频| 欧美va亚洲va香蕉在线| 不卡欧美aaaaa| 日韩欧美国产麻豆| 99久久精品免费精品国产| 日韩精品专区在线影院重磅| 成人免费黄色大片| 9191久久久久久久久久久| 国产精品资源网站| 欧美老女人第四色| 成人综合婷婷国产精品久久蜜臀 | 久久久美女毛片| 美女被艹视频网站| 久久久久青草大香线综合精品| 制服下的诱惑暮生| 国产欧美日韩在线| 国产精品无码一区二区三区免费| 中文字幕一区二区三区蜜月| 香蕉视频黄色在线观看| 一区二区在线观看视频| 麻豆一区在线观看| 日韩国产高清在线| 在线免费观看日本欧美| 国产一二三精品| 91精品国产色综合久久不卡电影| 成人av免费网站| 久久这里只有精品首页| 日本黄色免费观看| 亚洲精品va在线观看| 久久人妻无码aⅴ毛片a片app| 日韩av电影免费观看高清完整版在线观看| 成人免费视频国产免费观看| 蜜臀av性久久久久蜜臀aⅴ| 欧美性一级生活| 成人美女在线观看| 久久久久久久综合色一本| chinese麻豆新拍video| 亚洲一区在线观看免费观看电影高清| 女人18毛片毛片毛片毛片区二 | 香蕉久久一区二区不卡无毒影院| 97成人资源站| 国产精品综合久久| 久久人人超碰精品| 伊人网伊人影院| 日韩电影免费一区| 欧美剧情片在线观看| 99久久99久久精品国产片果冻| 欧美高清在线视频| 亚洲色图 激情小说| 久久精工是国产品牌吗| 日韩欧美成人一区二区| v天堂中文在线| 亚洲v日本v欧美v久久精品| 欧美午夜视频网站| 91色乱码一区二区三区| 最新中文字幕一区二区三区| 欧美精品久久久久久久久46p| 国产精品一区二区三区乱码| 久久婷婷国产综合国色天香| 亚洲自拍偷拍一区二区| 日韩电影在线免费| 日韩欧美国产一区二区在线播放 | 国产曰批免费观看久久久| 日韩亚洲欧美成人一区| 粉嫩av懂色av蜜臀av分享| 日韩精品一区二区三区老鸭窝| 成人免费毛片app| 国产精品午夜在线观看| a一级免费视频| 高清beeg欧美| 国产精品国产三级国产| 一本一本久久a久久精品综合麻豆 一本一道波多野结衣一区二区 | 亚洲欧美综合7777色婷婷| 国产精品伊人色| 国产欧美日韩另类一区| 内射一区二区三区| 成人av网在线| 一个色在线综合| 欧美精品高清视频| 9.1成人看片| 韩日欧美一区二区三区| 欧美国产日韩一二三区| 免费在线观看h片| 91麻豆产精品久久久久久| 亚洲国产成人porn| 日韩视频免费观看高清完整版在线观看| 亚洲一区二区观看| 国产一区二区不卡在线| 亚洲国产精品av| 欧美在线免费播放| 日本69式三人交| 久久se精品一区二区| 国产精品日日摸夜夜摸av| 一本色道久久综合狠狠躁的推荐| 91美女蜜桃在线| 日本aⅴ免费视频一区二区三区| 精品国产一区二区亚洲人成毛片 | 国产视频一区二区三区在线观看| 色哟哟一一国产精品| 99久久99久久免费精品蜜臀| 亚洲成人av一区二区三区| 精品奇米国产一区二区三区| 三级黄色免费观看| 国产探花一区二区三区| 免费成人结看片| 欧美激情综合网| 欧美少妇一区二区| 在线观看国产精品一区| 成人小视频免费在线观看| 亚洲国产日韩a在线播放| 精品88久久久久88久久久| www.超碰在线观看| av免费观看不卡| 国产一区二区久久| 亚洲黄色片在线观看| 日韩欧美国产麻豆| 色综合色综合色综合| 超碰男人的天堂| 国产v综合v亚洲欧| 午夜国产精品一区| 国产日本亚洲高清| 欧美精品一级二级三级| 国产在线免费av| 91porn在线| 国产成人综合精品三级| 午夜国产不卡在线观看视频| 国产午夜精品福利| 欧美日韩高清一区二区| 日韩欧美在线视频播放| 欧美夫妇交换xxx| 风间由美中文字幕在线看视频国产欧美| 亚洲国产精品一区二区尤物区| 久久精品人人爽人人爽| 欧美日韩国产综合久久| 国产在线免费看| 久久久精品人妻无码专区| 不卡一区二区三区四区| 精品在线你懂的| 午夜精品一区二区三区电影天堂| 国产精品毛片久久久久久久| 日韩欧美国产精品一区|