前端页面给指定的div添加遮罩层,并且带有加载中的小旋转图片
话不多说,先上代码,其实还是比较简单的
$("<div id='shade' style='opacity:0.85;background:white'></div><img src='${ctx}/static/images/loading2.gif'/>").css({
position:'absolute',
top:0,
left:0,
zIndex:300,
height:'100%',
width:'100%'
}).appendTo('#id');
其中#id就是你要遮罩的div的id,其中用到的加载中图片:加载中图片
就是这么简单,这里需要注意的事,要进行遮罩的div的样式要这样设置position:relative(切记,否则达不到你想要的效果!)
忘了说了,这里的js代码是基于JQuery写的,要引入JQuery文件哦!
效果图:

前端页面给指定的div添加遮罩层,并且带有加载中的小旋转图片的更多相关文章
- 基于Bootstrap的遮罩层,带有加载提示
1.body中的html <div class="modal fade" id="loadingModal"> <div style=&quo ...
- 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结
史上最全的CSS hack方式一览 2013年09月28日 15:57:08 阅读数:175473 做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我 ...
- jQuery加载一个html页面到指定的div里
一.jQuery加载一个html页面到指定的div里 把a.html里面的某一部份的内容加载到b.html的一个div里.比如:加载a.html里面的<div id=“row"> ...
- 使用jQuery加载html页面到指定的div
一.jQuery加载一个html页面到指定的div里 把a.html里面的某一部份的内容加载到b.html的一个div里.比如:加载a.html里面的<div id=“row"> ...
- 利用div实现遮罩层效果
利用div实现遮罩层效果就是利用一个全屏.半透明的div遮住页面上其它元素,典型的例子就是百度的登录界面.下面贴出示例代码: <!DOCTYPE html> <html> &l ...
- js添加遮罩层
直接用代码来说明 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="MaskT ...
- div+css遮罩层
曾被问到这个问题,不知所措,后来在网上找到了.大神文章:http://www.cnblogs.com/aspx-net/archive/2011/03/11/1981071.html 我想实现的效果没 ...
- 前端小结(3)---- 添加遮罩层,并弹出div
有如下div: <div id='pop-div' class="pop-box"> <div class="input-group has-info& ...
- 使用layer的弹窗时,出现layer引入成功,触发成功,控制台无报错,但是页面无变化或者仅出现遮罩层的问题的解决思路
------------------------------------------20180410补充------------------------------------------------ ...
随机推荐
- The import javax.servlet.jsp.JspWriter cannot be resolved' error
Add servlet-api.jar and jsp-api.jar from Tomcat 6.0 library to ecipse project.
- 论文笔记 — L2-Net: Deep Learning of Discriminative Patch Descriptor in Euclidean Space
论文: 本文主要贡献: 1.提出了一种新的采样策略,使网络在少数的epoch迭代中,接触百万量级的训练样本: 2.基于局部图像块匹配问题,强调度量描述子的相对距离: 3.在中间特征图上加入额外的监督: ...
- nyojb 2357
http://acm.nyist.me/JudgeOnline/problem.php?id=2357 2357: 插塔憋憋乐 时间限制: 1 Sec 内存限制: 128 MB提交: 50 解决: ...
- 编译内核时覆盖KBUILD_BUILD_USER和KBUILD_BUILD_HOST
默认情况下make kernel.img编译出来的内核在/proc/version中显示的内容是: Linux version 3.0.36+ (xxx@yyyy) (gcc version 4.6. ...
- Mysql进程管理
mysql> show processlist;+----+------+-----------+------+---------+------+-------+---------------- ...
- ADO.NET异步操作测试
配置文件: <?xml version="1.0"?> <configuration> <startup> <supportedRunti ...
- svn文件大小类型限制,提交必须加多少字的说明
#!/bin/sh REPOS="$1" TXN="$2" #此处更改大小限制,这里是5M MAX_SIZE= #此处增加限制文件后缀名 FILTER='\.( ...
- python_编码集的介绍
一.unicode的解释来自百度百科 1.ASCII 最知名的可能要数被称为ASCII的7位字符集了.它是美国标准信息交换代码(American Standard Code for Inform ...
- python3中zip()函数的用法
>>>a = [1,2,3] >>> b = [4,5,6] >>> c = [4,5,6,7,8] >>> zipped = ...
- 详细说明svn分支与合并,以及实例
详细说明svn分支与合并,以及实例 一,svn分支与合并有什么用? 作程序的,对svn在熟悉不过了,但对svn分支熟悉的,我想并不多.因为一般情况下,是用不着svn分支的,其实也没有那个必要.下面我例 ...