插件描述：jquery-fireworks是一款基于HTML5 Canvas的逼真烟花特效jQuery插件。该插件使用简单，并可自由进行配置。它可以在一个div容器中生成逼真的燃放烟花效果。
jquery-fireworks教程
jquery-fireworks是一款基于HTML5 Canvas的逼真烟花特效jQuery插件。该插件使用简单，并可自由进行配置。它可以在一个div容器中生成逼真的燃放烟花效果。
使用方法
在页面引入jquery和jquery.fireworks.js文件。
<script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.fireworks.js"></script>
HTML结构
使用一个<div>元素作为烟花的容器。
<div class="demo"></div>
初始化插件
在页面DOM元素加载完毕之后，可以通过fireworks()方法来初始化该烟花特效插件：
$('.demo').fireworks({
sound: true, // 声音效果
opacity: 0.9,
width: '100%',
height: '100%'
});PREVIOUS:
NEXT:
相关插件-动画效果
纯CSS3实现打火机火焰动画
这又是一款很酷的纯CSS3动画特效，它是一个可以点燃的打火机，当你用鼠标滑过这只打火机时，打火机就会打开，然后开始出现火焰燃烧的动画特效。另外要说明的是，整个动画都是利用纯CSS3实现的
动画效果
讨论这个项目（37）回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约
空心 0
2019/9/28 19:27:57
-
请问下有没有人知道怎么把烟花爆炸的范围弄大些呀
丁仆钧1
2021/1/27 10:03:36
var speed = Math.cos(Math.random() * Math.PI / 2) * 30;//修改爆炸范围吗，这里30就很大了。
this.resistance = 1.05;//修改速度，大于1，数值不要太大。
梦@无痕 0
2019/8/5 17:36:33
-
有人知道烟花上升的速度快点，怎么改？
西瓜1
2019/8/5 18:30:42
-
this.resistance = 1;改成this.resistance = 1.03;一点点改值不要改太大了。
梦@无痕0
2019/8/6 12:31:46
-
谢谢！
梦@无痕0
2019/8/6 14:37:16
-
还想请问下，jsl文件里面200行去掉黑色背景后，烟花发射完，会有印记，可以把发射后的印记取消不？
zousaili0
2020/1/13 9:56:15
-
你把烟花印记去掉了吗
BattleofLexington1
2020/1/13 11:53:06
把下面值
// clear canvas context.fillStyle = "rgba(0, 0, 0, 0.05)";
0.05改0.2就没有了
context.fillStyle = "rgba(0, 0, 0, 0.2)";
凌梦琳 0
2018/9/23 11:27:09
-
黑色背景如何去掉啊
骚年”0
2018/12/13 11:14:29
-
canvas的fillStyle属性设置背景颜色，在js代码201行可以改一下试试
😃
- 😀
- 😉
- 😥
- 😵
- 😫
- 😘
- 😡
- 👍
- 🌹
- 👏
- 🍺
- 🍉
- 🌙
- ⭐
- 💖
- 💔
😃
取消回复
- 😀
- 😉
- 😥
- 😵
- 😫
- 😘
- 😡
- 👍
- 🌹
- 👏
- 🍺
- 🍉
- 🌙
- ⭐
- 💖
- 💔
