CSS样式部分:

----------------------------------

<style type="text/css">
#loading-mask{
        position:absolute;
        left:0;
        top:0;
        width:100%;
        height:100%;
        z-index:20000;
        background-color:gray;
    }
    #loading{
        position:absolute;
        left:45%;
        top:40%;
        padding:2px;
        z-index:20001;
        height:auto;
 }
    #loading .loading-indicator{
        background:white;
        color:#444;
        font:bold 20px tahoma,arial,helvetica;
        padding:10px;
        margin:0;
        height:auto;
    }
    #loading-msg {
        font: normal 18px arial,tahoma,sans-serif;
    }
</style>

HTML部分:

-------------------------------------------------

<div id='loading-mask'></div>
<div id="loading">
    <div class="loading-indicator">
       <img src="large-loading.gif" width="32" height="32" style="margin-right:8px;float:left;vertical-align:top;"/>
       <br/><span id="loading-msg">Loading ...</span>
    </div>
</div>

div+css 遮罩层的更多相关文章

  1. div+css遮罩层

    曾被问到这个问题,不知所措,后来在网上找到了.大神文章:http://www.cnblogs.com/aspx-net/archive/2011/03/11/1981071.html 我想实现的效果没 ...

  2. CSS遮罩层的实现

    偶然发现自己原来写了一个CSS遮罩层,虽然这个东西没什么技术含量,但如果本人离开公司后又遇见此类问题,那么可能又得花些时间来找资料了.所以决定还是把它记下来吧. 直接上代码吧. 第一步,html代码: ...

  3. 利用div实现遮罩层效果

    利用div实现遮罩层效果就是利用一个全屏.半透明的div遮住页面上其它元素,典型的例子就是百度的登录界面.下面贴出示例代码: <!DOCTYPE html> <html> &l ...

  4. CSS 遮罩层、滑出页面

    <style> .panel_bak { position:fixed; bottom:0; display:none; width:100%; margin:0px; padding:5 ...

  5. CSS遮罩层简易写法

      现在很多站点弹出框,都需要一个遮罩层.写法很多,以下是我比较喜欢的一种: .box{ position:absolute; top:0; bottom:0; left:0; right:0; ba ...

  6. 前端页面给指定的div添加遮罩层,并且带有加载中的小旋转图片

    话不多说,先上代码,其实还是比较简单的 $("<div id='shade' style='opacity:0.85;background:white'></div> ...

  7. css遮罩层

    父元素:position:fixed; 让子元素居中对齐:position:absolute;top:0;bottom:0;left:0;right:0;margin:auto; <style& ...

  8. CSS遮罩层,全兼容

    <script type="text/javascript"> $(function(){ $('#divLocker').css({ "position&q ...

  9. 子div作为遮罩层

    效果图: 子div的代码:

随机推荐

  1. Codeforces 417E

    #include<iostream> #include<cstring> #include<cstdio> #include<cmath> #inclu ...

  2. POJ 2828 单点更新(好题)

    Buy Tickets Time Limit: 4000MS   Memory Limit: 65536K Total Submissions: 15086   Accepted: 7530 Desc ...

  3. hdu 4630 No Pain No Game

    http://acm.hdu.edu.cn/showproblem.php?pid=4630 离散化+树状数组 将数组 *a  从后向前遍历 遍历到 a[x] 的时候 再枚举a[x]的约数 假如 约数 ...

  4. node.js安装及grunt插件,如何进行脚本压缩

    http://gruntjs.com/pluginshttp://gruntjs.com/getting-startedhttp://gruntjs.com/configuring-tasks#glo ...

  5. ROS语音识别

    一.语音识别包 1.安装         安装很简单,直接使用ubuntu命令即可,首先安装依赖库: $ sudo apt-get install gstreamer0.10-pocketsphinx ...

  6. (转载)java常见的ClassNotFoundException

    1 - java.lang.ClassNotFoundException: org.apache.commons.logging.LogFactory   添加包common-logging.jar2 ...

  7. 【转】Linux下nginx配置https协议访问的方法

    一.配置nginx支持https协议访问,需要在编译安装nginx的时候添加相应的模块--with-http_ssl_module 查看nginx编译参数:/usr/local/nginx/sbin/ ...

  8. 【转发】CentOS 7 巨大变动之 systemd 取代 SysV的Init

    1 systemd是什么 首先systmed是一个用户空间的程序,属于应用程序,不属于Linux内核范畴,Linux内核的主要特征在所有发行版中是统一的,厂商可以自由改变的是用户空间的应用程序.   ...

  9. [转]shell基本算术运算

    from:http://www.cnblogs.com/yfanqiu/archive/2012/05/10/2494031.html#undefined shell程序中的操作默认都是字符串操作,在 ...

  10. python解无忧公主的数学时间编程题001.py

    python解无忧公主的数学时间编程题001.py """ python解无忧公主的数学时间编程题001.py http://mp.weixin.qq.com/s?__b ...