实现原因:
很多情况下需要一个loading特效显示正在加载
优点:
1、易用
2、自适应
3、面向对象,支持多实例
4、支持7种可选效果,css3实现,不含gif
5、完美设计
缺点:
不存在的,因为它是完美的
简单粗暴方式(必须首先提供的方式)
下载最新版本
&& 使用标签引用
<link rel="stylesheet" href="osloading.css">
<script src="osloading.js"></script>
npm + CommonJS 方式
npm install osloading
var osloading = require('osloading');
var el = document.querySelector('.loading');
var loading = new osloading({
el:el, //需要遮挡的元素
type:2, //支持7种 1-7
color:"#fe7f02", //loading动画的颜色
backgroundColor:"#333", //背景色
opacity:1 //背景透明度
});
loading.show(); // 显示
setTimeout(function () {
el.style.width = el.style.height = 600 + 'px';
},2000);
setTimeout(function () {
loading.hide(); //隐藏
//loading.remove(); //从页面上删除
},4000);
如有问题,欢迎加入下面QQ群