前端小结(4)---- 页面加载loding....
/*正在加载*/
function showLoading(elem) {
var html = '<div class="loading"><div id="over" class="over"></div><div id="layout" class="layout"><img src="../../assets/img/loading.gif" /></div></div>'
if (elem) {
elem.after(html);
} $("#over").css("display", "block");
$("#layout").css("display", "block");
} function hideLoading(elem) {
elem.next().remove();
}
<img src="../../assets/img/loading.gif" />中替换成对应的加载图标 对应css:
.over {
display: none;
position: absolute;
top:;
left:;
width: 100%;
height: 100%;
background-color: rgba(2, 2, 2, 0.15);
opacity: 0.5;
z-index:;
}
.layout {
display: none;
position: absolute;
top: 28%;
left: 40%;
width: 20%;
height: 20%;
z-index:;
text-align: center;
}
前端小结(4)---- 页面加载loding....的更多相关文章
- 前端开发,页面加载速度性能优化,如何提高web页面加载速度
一个网页访问速度的快慢, 不仅看它服务器的配置,这里除去你空间主机配置很烂的情况以外,我们从网站开发方面来探讨,前端技术需要从哪些方面提高访问的速度,需要用到哪些技术手段. 文件的加载 图标的加载: ...
- 【前端工具】页面加载获取url param
例如跳转进入一个页面: https://mp.csdn.net/postedit/74766644?name=catalina&flag=1 函数: function getParam(par ...
- Web前端性能优化——如何提高页面加载速度
前言: 在同样的网络环境下,两个同样能满足你的需求的网站,一个"Duang"的一下就加载出来了,一个纠结了半天才出来,你会选择哪个?研究表明:用户最满意的打开网页时间是2-5秒, ...
- 从输入URL到页面加载的过程?如何由一道题完善自己的前端知识体系!
前言 见解有限,如有描述不当之处,请帮忙指出,如有错误,会及时修正. 为什么要梳理这篇文章? 最近恰好被问到这方面的问题,尝试整理后发现,这道题的覆盖面可以非常广,很适合作为一道承载知识体系的题目. ...
- 【转】Web前端性能优化——如何提高页面加载速度
前言: 在同样的网络环境下,两个同样能满足你的需求的网站,一个“Duang”的一下就加载出来了,一个纠结了半天才出来,你会选择哪个?研究表明:用户最满意的打开网页时间是2-5秒,如果等待超过10秒, ...
- Web前端性能优化——提高页面加载速度
前言: 在同样的网络环境下,两个同样能满足你的需求的网站,一个“Duang”的一下就加载出来了,一个纠结了半天才出来,你会选择哪个?研究表明:用户最满意的打开网页时间是2-5秒,如果等待超过10秒, ...
- 前端 页面加载完成事件 - onload,五种写法
在js和jquery使用中,经常使用到页面加载完成后执行某一方法.通过整理,大概是五种方式(其中有的只是书写方式不一样). 1:使用jQuery的$(function){}; 2:使用jquery的$ ...
- css3 linear-gradient实现页面加载进度条效果
最终效果图: html结构: <div> <p class="p1"> <span></span> < ...
- 利用Navigation Timing测量页面加载时间
最近在看一本名为<web性能实践日志>的书籍,其中第十三章"网络计时"中介绍了一种比较新的计算页面各部分加载时间方法,这也是W3C Web性能工作小组正在做的事情,接下 ...
随机推荐
- input 实现onchange效果
$(".selected input").on('input',function(e){ cc.search(); });
- luoguP3359 改造异或树
https://www.luogu.org/problemnew/show/P3359 因为 a ^ b ^ b = a,所以我们预处理 1 到所有点的距离,将删边的操作反过来变成加边,对于每一个联通 ...
- Ruby 和 OpenSSL CA 证书的问题
作为一个版本控,总是希望保持电脑中各种软件到最新版本. 最近通过 brew 升级 OpenSSL 和 ruby-build 到最新,尤其是 ruby-build 支持最新的 Ruby 2.2.1,新版 ...
- Ionic无法通过npm安装解决方案
http://www.jianshu.com/p/5a99334eb62d 一般从 node.js官网下载安装完之后,npm也会同时安装完. 如果通过 $ npm install -g cordova ...
- npm淘宝镜像和默认镜像切换
1.得到原本的镜像地址 npm get registry > https://registry.npmjs.org/ 设成淘宝的 npm config set registry http://r ...
- POJ3321 Apple Tree (JAVA)
树形数组题,有一定难度. 首先得搞清楚树形数组是什么 - 它是建立在原始数组上的统计数组 - 目的:方便对原始数组进行切片统计,主要用于统计切片的累加和 其实你可以对切片进行扫描,把元素一个一个加起来 ...
- 1.jQuery入口函数
<!--注意,如果需要对ie67兼容,我们可以使用原生低版本的jquery 比如说jquery-1.12.4.js--> <!DOCTYPE html> <html la ...
- 在makefile中打印错误或警告信息
在makefile中打印警告或者错误消息的方法: $(warning xxxxx) 或者 $(error xxxxx) 输出变量方式为: $(warning $(XXX))
- 查看已安装tensorflow版本以及安装路径
查看版本: import tensorflow as tf tf.__version__ 查看安装路径: tf.__path__
- 阿里云Centos下安装nginx之后外网无法访问
centos 7.4 nginx1-14.0编译安装 curl 127.0.0.1 可以请求到 index.html curl local 可以请求到 index.html http://ip/ 无法 ...