前端小结(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性能工作小组正在做的事情,接下 ...
随机推荐
- [Maven实战-许晓斌]-[第三章] Mave使用入门
<?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://mave ...
- c语言-折半查找的函数
void search(int n,int num[],char name[N][10]) { int top,bottom,middle,location,flag; top=0; bottom=N ...
- angular5新增全局的模块
比如新增一个全局的swiper,需要在webpack中配置: 之后在代码中就可以用了
- 123th LeetCode Weekly Contest Add to Array-Form of Integer
For a non-negative integer X, the array-form of X is an array of its digits in left to right order. ...
- python爬虫之urllib库(三)
python爬虫之urllib库(三) urllib库 访问网页都是通过HTTP协议进行的,而HTTP协议是一种无状态的协议,即记不住来者何人.举个栗子,天猫上买东西,需要先登录天猫账号进入主页,再去 ...
- python函数参数类型及其顺序
根据inspect模块官文文档中关于函数参数类型的相关说明,python函数参数共有五种类型,按顺序分别为:POSITIONAL_ONLY.POSITIONAL_OR_KEYWORD.VAR_POSI ...
- 安装 VMware Tools
参考帮助文档 错误#1: tar: vmware-tools-distrib: Cannot mkdir: Read-only file system 解决方法: mkdir /mnt/cdrom m ...
- hibernate 自动创建表中文乱码问题
<property name="connection.url" > <![CDATA[jdbc:mysql:///test?useUnicode=true& ...
- Junit打包测试
在一个项目中,只写一个测试类是不可能的,我们会写出很多很多个测试类.可是这些测试类必须一个一个的执行,也是比较麻烦的事情. 鉴于此, JUnit 为我们提供了打包测试的功能,将所有需要运行的测试类集中 ...
- 【CSS】 布局之浮动float和绝对定位absolute的选择
浮动float: 浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止. 由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样.(W3C) 绝对定位 ...