加载状态为complete时移除loading效果
一、JS代码:
//获取浏览器页面可见高度和宽度
var _PageHeight = document.documentElement.clientHeight,
_PageWidth = document.documentElement.clientWidth;
//计算loading框距离顶部和左部的距离(loading框的宽度为215px,高度为61px)
var _LoadingTop = _PageHeight > 61 ? (_PageHeight - 61) / 2 : 0,
_LoadingLeft = _PageWidth > 215 ? (_PageWidth - 215) / 2 : 0;
//在页面未加载完毕之前显示的loading Html自定义内容
var _LoadingHtml = '<div id="loadingDiv" style="position:absolute;left:0;width:100%;height:' + _PageHeight + 'px;top:0;background:#f3f8ff;opacity:0.8;filter:alpha(opacity=80);z-index:10000;"><div style="position: absolute; cursor1: wait; left: ' + _LoadingLeft + 'px; top:' + _LoadingTop + 'px; width: auto; height: 57px; line- height: 57px; padding-left: 50px; padding- right: 5px; background: #fff url(/Content/loading.gif) no- repeat scroll 5px 10px; border: 2px solid #95B8E7; color: #696969; font- family:\'Microsoft YaHei\';">页面加载中,请等待...</div></div>';
//呈现loading效果
document.write(_LoadingHtml);
//window.onload = function () {
// var loadingMask = document.getElementById('loadingDiv');
// loadingMask.parentNode.removeChild(loadingMask);
//};
//监听加载状态改变
document.onreadystatechange = completeLoading;
//加载状态为complete时移除loading效果
function completeLoading() {
if (document.readyState == "complete") {
var loadingMask = document.getElementById('loadingDiv');
loadingMask.parentNode.removeChild(loadingMask);
}
}
加载状态为complete时移除loading效果的更多相关文章
- js 判断页面加载状态
//----判断当前页面是否加载状态 开始 ---- document.onreadystatechange = subSomething;//当页面加载状态改变的时候执行这个方法. function ...
- 动态加载JS文件,并根据JS文件的加载状态来执行自己的回调函数
动态加载JS文件,并根据JS文件的加载状态来执行自己的回调函数, 在很多场景下,我们需要在动态加载JS文件的时候,根据加载的状态来进行后续的操作,需要在JS加载成功后,执行另一方法,这个方法是依托在加 ...
- IOS 多个UIImageView 加载高清大图时内存管理
IOS 多个UIImageView 加载高清大图时内存管理 时间:2014-08-27 10:47 浏览:59人 当我们在某一个View多个UIImageView,且UIImageView都显示的是 ...
- RxJava异步请求加载状态控制
在我看来,RxJava最大的特点就是异步,无论你是解析复杂的数据或是IO操作,我们都可以利用它内置的线程池进行线程间的调度,简单的使用 subscribeOn(Schedulers.io()).doO ...
- Sql 问题---在尝试加载程序集 ID 65537 时 Microsoft .NET Framework 出错.服务器可能资源不足
新库是直接复制的模板库 执行存储过程时报如下错 消息 10314,级别 16,状态 11,过程sp_Sync_CmsArticleToSearchs,第 30 行在尝试加载程序集 ID 65645 时 ...
- 尝试加载 Oracle 客户端库时引发 BadImageFormatException
尝试加载 Oracle 客户端库时引发 BadImageFormatException 工程师给计算机诊断,就像医生给病人诊断一样,很多同样的症状,可能是由多种截然不同的原因导致的. 最近进行C# ...
- 尝试加载 Oracle 客户端库时引发 BadImageFormatException。问题记录
电脑是win8 64位,安装oracle 11g r2 64位的,谁知道一切装完毕后,打开项目却连不上oracle数据了...首先是pl/sql连不上,装了oracle服务器,应该是不用再装客户端,p ...
- Visual Studio《加载此属性页时出错》的解决办法
打开aspx页面时不能切换到设计视图,vs 2008工具箱中无控件.打开vs 2008的工具>选项>HTML设计器时提示:加载此属性页时出错 有时还会有其它错误提示,比如打开一个Windo ...
- bootstrap按钮加载状态改变
bootstrap里面有个激活按钮的时候,按钮变成不可用的: 按照官网里面的方法介绍是在button按钮加个data-loading-text="Loading..."属性,然后j ...
随机推荐
- ajax返回数据类型为XML数据的处理
/*XML:可扩展标记语言 HTML:超文本标记语言 标签:<标签名></标签名> 特点: 1.必须要有一个根 2.标签名自定义 3.对大小写敏感 4.有开始就要有结束 5.同 ...
- Ruby on rails学习笔记——安装环境
出现问题: C:\Users\len>gem install rails ERROR: While executing gem ... (Gem::RemoteFetcher::FetchErr ...
- python判断字符串
python判断字符串 s为字符串s.isalnum() 所有字符都是数字或者字母s.isalpha() 所有字符都是字母s.isdigit() 所有字符都是数字s.islower() 所有字符都是小 ...
- WAMPSERVER 64位 win7下 php 5.5.12通过 PECL 安装 zip扩展
通过phpinfo()查看 php5.5.12默认集成了zip模块 不过版本是1.11.0 http://pecl.php.net/package/zip 通过PECL 查看 最新版本是1.12.4 ...
- yii2 小技巧
参考地址:http://www.cnblogs.com/sandea/p/5714830.html 1.不通过日志获取AR执行的原生SQL语句和打印变量数据 $query = User::find() ...
- 关于http请求
response的Head值: 200 : 请求已成功,请求所希望的响应头或数据体将随此响应返回 304 : Not Modified 客户端有缓冲的文档并发出了一个条件性的请求,原来缓冲的文档还 ...
- http request method and response codes
============================ HTTP_Method============================ HTTP Method Action Examples GET ...
- JavaScript数组属性与方法
Array 对象属性 属性 描述 constructor 返回对创建此对象的数组函数的引用. length 设置或返回数组中元素的数目. prototype 使您有能力向对象添加属性和方法. Arra ...
- Ansible简明使用手册
Ansible使用简明手册 1.简介 ansible是新出现的自动化运维工具,基于Python开发,集合了众多运维工具(puppet.cfengine.chef.func.fabric ...
- 电脑开机黑屏,显示Reboot and Select proper boot device!
“reboot and select proper boot device or insert boot media in selected boot device and press a key” ...