基于JQUERY BOOTSTRAP 最简单的loading遮罩层

LeoNature 2018-10-24

<%--loading遮罩层--%>

<div class="modal fade" id="loadingModal" backdrop="static" keyboard="false">

<div style="width: 200px;height:20px; z-index: 20000; position: absolute; text-align: center; left: 50%; top: 50%;margin-left:-100px;margin-top:-10px">

<div class="progress progress-striped active" style="margin-bottom: 0;">

<div class="progress-bar" style="width: 100%;"></div>

</div>

<h5 id="loadText">loading...</h5>

</div>

</div>

<%--loading方法--%>

<script type="text/javascript">

var loadingTime= 5;//默认遮罩时间

showLoading = function (loadText) {

if(!loadText){

$("#loadText").html(loadText)

}

$('#loadingModal').modal({backdrop: 'static', keyboard: false});

}

hideLoading = function () {

$('#loadingModal').modal('hide');

}

</script>

基于JQUERY BOOTSTRAP 最简单的loading遮罩层

相关推荐