html5粉色的气球飘过元素背景

【原创】html5基于svg绘制一大串粉色的气球空中飘动飞过，页面中间带文字logo，这样的一个动态元素背景特效。这是一款绚丽大气的引导页背景特效。

[声明] 墨鱼部落格所有资源为用户免费分享产生，若发现您的权利被侵害，请点击后方链接查看并联系我们，我们尽快处理。免责声明|侵权处理流程

使用方法：

1、head引入css文件

<link rel="stylesheet" href="css/style.css">

2、head引入js文件

<script src='js/jquery.min.js'></script>
<script src='js/pixi.min.js'></script>

3、body引入HTML代码

<div class="title">
	<h3 class="hello">HELLO</h3>
	<svg class="hello-dribbble" x="0px" y="0px" viewBox="0 0 285.5 73.5">
		<path class="dribbble" d="M282.8,56.2c-11.8,19.9-30.4,14.1-36,9.6c-2.4,1.6-6.6,5.2-12.1,4.7c-11.8-0.9-16.1-17.8-16.1-17.8
		c0.1,0.1-3.5,1.2-5.5,1.2c0,5-4.3,16.8-15.9,16.7c-13-0.2-15.6-19.5-15.6-19.5s-1.3,1.8-6.2,3.6c0.2-3.8,0.1,15.4-15.5,15.6
		c-12.3,0.2-15.6-19.5-15.6-19.5s-2.1,2.2-6.3,3c0.3-3.9-0.2,16.6-15.7,16.5c-10.5,0-14.1-12.2-13.8-13.9c0.4-2.1-3.6,14.2-13.8,13.9
		c-4.2-0.1-7.4-3.2-9.3-7.3c-2.6,3-6.5,7.3-10.8,7.3c-7.7,0-11.1-6.5-10.6-24.9c0-2.2-0.1-3.1-2.3-3.4c-1.3-0.2-2.6-0.6-4.1-0.8
		c-0.5,1.5-4.3,28.7-17.5,29.2c-4.4,0.2-6.9-3.7-8.9-6.5c-3.1,4-7.1,6.7-12.8,6.7C8.6,70.6,2,62.7,2,53c0-9.7,6.6-17.6,16.4-17.6
		c1.7,0,2.2,0.2,3.8,0.7c-3.2-29.4,4.4-34,11.1-34c6.4,0,17.4,14.9,2,52.6C38.6,66,46,65.4,49.5,42.2c0.7-4.7-1.2-11.1,1.8-12
		c5.5-1.6,6.1,3.2,8.6,4.1c2.7,0.9,4.3,0.8,6.9,1.3c4.5,0.9,6.2,3.3,5.7,8.6C71.9,51,70.7,60.8,74.2,62c2.5,0.9,7.1-4.3,7.9-7.2
		c0.8-2.8,1-3.8,1-5.9c0.1-4.5,0.2-7.7,1-11.1c0.3-1.3,0.7-2.2,2.2-2.2c1.2,0,3.4-0.4,4.4,0.4c1.3,1,1.1,2,1,4.6
		c-1.5,37.4,10.2,18.7,13.7,3.8C104.2,27.4,105,2.4,115.6,2c5.5-0.2,7.9,4.2,8.2,7.5c0.8,9.3-3.5,24.7-9.1,35
		c-3.2,21.1,13.9,25.3,16.7,8.4c-4.5-2.1-9.3-10.7-5.4-14.9c2.2-2.4,11.4,1,11.6,8.4c4.5-1.2,5.1-3.8,5.2-3.3
		c-1.2-16.9-0.1-40.7,10.5-41.1c5.5-0.2,7.9,4.2,8.2,7.5c0.8,9.3-3.5,24.7-9.1,35c-3.2,21.1,13.9,25.3,16.7,8.4
		c-3.3-0.6-10.3-9.8-6.3-14.9c2.2-2.7,11.3,3,12.3,8.7c4.3-1.2,4.9-3.7,5-3.3c-1.2-16.9-0.1-40.7,10.5-41.1c5.5-0.2,7.9,4.2,8.2,7.5
		c0.8,9.3-3.5,24.7-9.1,35c-3.2,21.1,13.9,25.3,16.7,8.4c-4.6-0.8-11-10.4-5.8-15.4c2.1-2,10,3.2,11.9,9c2.6-0.1,4.2-1,4.5-1.1
		C212.9,26,216,2.2,227.4,2c6.2-0.1,12.2,3.3,9.5,22.2c-2.5,18-11.6,25.5-11.6,25.7c0.5,2.2,5.2,20.2,16.9,10.7
		c-0.6-1.4-1.2-2.8-1.6-4.5c-1.9-9.9,1.9-21.1,12.2-22.9c5.9-1,11.5,1.9,12.4,8.4c1.5,10.7-8.2,18.4-11.8,20
		c-1.6-0.9,14.9,9.6,24.6-11.6c0.6-1.2,1.3-1.1,2.1-0.5C280.9,50,284.5,53.4,282.8,56.2z M25.4,50.4c-0.5-1.5-1.5-4.8-1.9-6.2
		c-2-1.7-3.4-2-6-2c-5.7,0-9,5.3-9,10.9c0,5.7,3.6,10.9,9.3,10.9c4.9,0,8.7-3.3,9.8-8.1C26.9,54.1,26.1,52.4,25.4,50.4z M33.1,9.9
		c-4,0-5.3,9.5-5.1,17.6c0.2,7.2,2.2,13.5,3.3,16.3c0.3,0.4,0.2,0.1,0.5,0.5C38.7,29.2,35.8,9.9,33.1,9.9z M116.2,10.2
		c-5.2-0.6-5.1,20.9-4.5,25.7C114.4,31.6,119,11.4,116.2,10.2z M153.8,10.2c-5.2-0.6-5.1,20.9-4.5,25.7
		C152,31.6,156.7,11.4,153.8,10.2z M191.2,10.5c-5.2-0.6-5.1,20.9-4.5,25.7C189.4,31.9,194,11.7,191.2,10.5z M228,9
		c-8,1.6-6.2,28.4-4.9,33.1C232.5,29.1,232.7,8.5,228,9z M258.1,42.4c-0.4-1.7-2.5-2.6-3.9-2.4c-4,0.6-7.9,5.6-6.4,13.2
		c0.3,1.7,1.2,3.3,1.2,3.2C258,50.4,258.7,45.6,258.1,42.4z M87.9,29.6c-3.2,0-5.8-2.6-5.8-5.8s2.6-5.8,5.8-5.8s5.8,2.6,5.8,5.8
		S91.1,29.6,87.9,29.6z"/>
	</svg>
	<h3 class="plasm">PLASM.it - 2017</h3>
</div>

<script src="js/index.js"></script>

文件目录

本资源来自：代码 » HTML5实例 » html5粉色的气球飘过元素背景

注：此资源非帝国CMS模板/特效/源码，需要帝国CMS整站模板源码的小伙伴，请移步 帝国CMS模板，感谢支持！