jquery-show-loading是一款小巧的jQuery自定义页面加载loading指示器插件。该插件可以在页面加载时显示自定义的loading指示器,遮罩层。并提供配置参数和回调函数来控制遮罩层和loading指示器的显示和隐藏。
使用方法
使用该插件需要引入jQuery和jquery.showLoading.min.js文件。
<script src="js/jquery-2.1.4.min.js"></script> <script src="dist/jquery.showLoading.min.js"></script>
CSS样式
loading指示器的基本CSS样式如下:
.loading-indicator { height: 80px; width: 80px; background: url('loading.gif') no-repeat center center; }
遮罩层的基本CSS样式如下:
.loading-indicator-overlay { background-color: #FFFFFF; opacity: 0.6; filter: alpha(opacity = 60); }
调用插件
可以使用下面的方法来显示一个loading指示器。
$('#el').showLoading();
要隐藏Loading指示器,可以调用下面的方法:
$('#el').hideLoading();
配置参数
该插件有下面的一些可用参数。
// configuration options. indicatorID: '', addClass: '', hPos: 'center', vPos: 'center', indicatorZIndex: 5001, overlayZIndex: 5000, parent: '', marginTop: 0, marginLeft: 0, overlayWidth: null, overlayHeight: null, overlayCSS: '' // callbacks beforeShow: null, afterShow: null,
版权声明
版权说明: 仅限用于学习和研究目的;不得将上述内容用于商业和非法用途!否则一切后果自负。我们非常重视版权问题,如有侵权请邮件至(171373236#qq.com)与我们联系处理,敬请谅解!