码迷,mamicode.com
首页 > 其他好文 > 详细

遮罩层

时间:2017-09-25 13:11:39      阅读:110      评论:0      收藏:0      [点我收藏+]

标签:--   show   代码   pac   pad   dex   col   fun   ima   

html代码

<!-- loading 层 -->
<div id="loadingDivBack" style="display: none; position: absolute; top: 0; left: 0; width: 100%; op: 0; background: #eeeeee; opacity: 0.7; filter: alpha(opacity=30); z-index: 100;"></div>
<div id="loadingDiv" style="display: none; position: absolute; cursor1: wait; width: auto; height: 57px; line-height: 57px; padding-left: 50px; padding-right: 5px; z-index: 101; background: #fff url(<?php echo SHOP_TEMPLATES_URL;?>/images/loading.gif) no-repeat scroll 5px 10px; border: 2px solid #95B8E7; color: #696969; font-family: \‘Microsoft YaHei\‘; ">正在提交,请等待...</div>

js代码

showLoading();
function showLoading() {
        var _PageHeight = $(document).height();//document.documentElement.clientHeight,
        _PageWidth = document.documentElement.clientWidth;
        //计算loading框距离顶部和左部的距离(loading框的宽度为215px,高度为61px)
        var _LoadingTop = $(document).scrollTop() + document.documentElement.clientHeight / 2;//折叠高度+1/2浏览器高度得到当前视图中间
        _LoadingLeft = _PageWidth > 215 ? (_PageWidth - 215) / 2 : 0;
        $("#loadingDivBack").height(_PageHeight);
        $("#loadingDiv").css("left", _LoadingLeft + "px");
        $("#loadingDiv").css("top", _LoadingTop + "px");
        $("#loadingDivBack").show();
        $("#loadingDiv").show();
    }

 

遮罩层

标签:--   show   代码   pac   pad   dex   col   fun   ima   

原文地址:http://www.cnblogs.com/Dong-Ge/p/7591135.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!