带声音效果的烟花发射及燃放动画效果-html代码-BFW代码库

带声音效果的烟花发射及燃放动画效果

代码语言：html

所属分类：粒子

代码描述：带声音效果的烟花发射及燃放动画效果，多种图形及文字燃放效果

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
    canvas {
  display: block;
}

.block-audio {
  display: none;
}
body{padding: 0px;margin: 0px}
</style>
</head>

<body style="position: absolute;">
<div class="block-audio">
  <audio class="exp" src="http://repo.bfw.wiki/bfwrepo/sound/5e769c8e8c7bd.mp3" controls></audio>
  <audio class="exp" src="http://repo.bfw.wiki/bfwrepo/sound/5e769c95c8a6e.mp3" controls></audio>
  <audio class="exp" src="http://repo.bfw.wiki/bfwrepo/sound/5e769d2d64114.mp3" controls></audio>
  <audio class="exp" src="http://repo.bfw.wiki/bfwrepo/sound/5e769d3f5bed7.mp3" controls></audio>
  <audio class="exp" src="http://repo.bfw.wiki/bfwrepo/sound/5e769d46ac406.mp3" controls></audio>
  <audio class="exp" src="http://repo.bfw.wiki/bfwrepo/sound/5e769d4caefad.mp3" controls></audio>
  <audio class="exp" src="http://repo.bfw.wiki/bfwrepo/sound/5e769d532b25a.mp3" controls></audio>

  <audio class="launch" src="http://repo.bfw.wiki/bfwrepo/sound/5e769d60a9365.mp3" controls></audio>
  <audio class="launch" src="http://repo.bfw.wiki/bfwrepo/sound/5e769d665a3ab.mp3" controls></audio>
  <audio class="launch" src="http://repo.bfw.wiki/bfwrepo/sound/5e769d6c478cc.mp3" controls></audio>
  <audio class="launch" src="http://repo.bfw.wiki/bfwrepo/sound/5e769d7220789.mp3" controls></audio>
  <audio class="launch" src="http://repo.bfw.wiki/bfwrepo/sound/5e769d77b2d35.mp3" controls></audio>

</div>
<canvas id="canvas"></canvas>

<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>
<script>
    $(function() {
	var canvas = $('#canvas')[0];
	canvas.width = $(window).width();
	canvas.height = $(window).height();
	var ctx = canvas.getContext('2d');

	// resize
	$(window).on('resize', function() {
		canvas.width = $(window).width();
		canvas.height = $(window).height();
		ctx.fillStyle = '#000003';
		ctx.fillRect(0, 0, canvas.width, canvas.height);
		center = { x: canvas.width / 2, y: canvas.height / 2 };
	});

	//.........完整代码请登录后点击上方下载按钮下载查看