很多时候我们需要引入框架来开发项目,这时我们可能会遇到页面还没加载完源码出来了的问题,给用户一种不好的视觉体验,这是便需要loading加载了,来完善用户体验!

 /*loading.js*/
// 加载HTML图
var _LoadingHtml = '<div id="loadingDiv" style="position:fixed;left: 0;top: 0;right: 0;bottom: 0;z-index: 99999;background-color: #fff;"><div style="position: fixed;top: 50%;left: 50%;transform: translate(-50%,-50%);"><img src="data:images/loading.gif" style="vertical-align: middle;width: 100px;">加载中。。。</div></div>'; // 呈现loading效果
document.write(_LoadingHtml); // 监听加载状态改变
document.onreadystatechange = completeLoading; // 加载状态为complete时移除loading效果
function completeLoading() {
if (document.readyState == "complete") {
var loadingMask = document.getElementById('loadingDiv');
loadingMask.parentNode.removeChild(loadingMask);
}
}

最新文章

  1. Linux常见查看硬件信息指令
  2. cnblogs技术知识共享
  3. FineUI v3.3.2发布!目前最稳定版本,五年陈酿!
  4. Word有用的快捷键
  5. PagedList.MVC分页
  6. Android AIDL SERVICE 双向通信 详解
  7. Facebook 调试工具Stetho配置入门
  8. ImageView及其子类(三)
  9. Spark数据本地化--&gt;如何达到性能调优的目的
  10. zTree实现删除树节点
  11. BZOJ3505 CQOI2014数三角形(组合数学)
  12. Idea下安装Lombok插件
  13. 【C语言】 二叉树的基本运算
  14. poj2186tarjan算法缩点求出度
  15. 20155206《网络对抗》Web安全基础实践
  16. Effective Tensorflow[转]
  17. 让node支持es模块化(export、import)的方法
  18. C#和.net框架
  19. Floyd求字典序最小的路径
  20. 关系运算符:instanceof

热门文章

  1. 三种定义bean的方式
  2. Win32 CMD批处理命令
  3. 腾讯Alloy团队代码规范
  4. CentOS第一次安装MySQL的完整步骤
  5. Spring MVC 后端获取前端提交的json格式字符串并直接转换成control方法对应的参数对象
  6. ubuntu 16.04 下更换boost版本
  7. Liferay7 BPM门户开发之24: Liferay7应用程序安全
  8. ubuntu18.04 运行时提示缺少libstdc++.so.6
  9. TCP/IP 笔记 - 广播和本地组播
  10. mybatis--Mapper 常见报错总结(持续总结)