带粒子背景的圆环旋转加载特效

来源:https://www.sucaihuo.com/js/2783.html 2017-08-19 23:01浏览(2152) 收藏

一款带粒子背景的圆环旋转加载特效,有蓝色和白色两种动态的粒子背景,不同旋转方向的圆环无限循环的旋转着,中间的“加载中...”字样也有一个颜色的变化效果。
带粒子背景的圆环旋转加载特效
分类:css3 > transform 难易:初级
查看演示 下载资源 下载积分: 20 积分

页面的head部分,需引入页面元素的样式文件,代码如下:

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

页面的body部分,需设置好旋转圆环和粒子背景的div容器,代码如下:

<div class="e-loadholder">
	<div class="m-loader">
		<span class="e-text">加载中...</span>
	</div>
</div>
<div id="particleCanvas-Blue"></div>
<div id="particleCanvas-White"></div>

页面的底部,需引入粒子插件和配套的设置JS,代码如下:

<script src='https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js'></script>
<script type="text/javascript" src="js/index.js"></script>
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2