var mask = function(){

$('<div>').css({

  position: 'fixed',

  left: 0,

  top: 0,

  width: '100%',

  height: '100%',

  zIndex: '90',

  backgroundColor: 'rgb(0, 0, 0)',

  opacity: 0.5

}).appendTo('body').attr('id', '_jsPop');

$('#_jsPop').click(function(){

  $(this).remove();

});

};

在线DEMO: http://output.jsbin.com/biyibukuvo

页面添加 mask 遮罩层的更多相关文章

  1. css案例 - mask遮罩层的华丽写法

    mask遮罩蒙层使用通常的写法的bug 通常写法pug .mask 通常写法css .mask{ position: absolute; top: 0; right: 0; bottom: 0; le ...

  2. 非一屏页面，出现遮罩层页面位置不动，并且遮罩层一屏显示。（pc,移动端都适用的方法）

    首先展示页面效果: 遮罩没出现的页面张酱紫:页面在楼层二这个位置. 遮罩显示:后面页面页面任停留在当前浏览位置,滚动条并未回顶部 下面来说说写法: css: 页面具体布局样式......(此处省略无数 ...

  3. web页面弹出遮罩层,通过js或css禁止蒙层底部页面跟随滚动

    场景概述 弹窗是一种常见的交互方式,而蒙层是弹窗必不可少的元素,用于隔断页面与弹窗区块,暂时阻断页面的交互.但是,在蒙层元素中滑动的时候,滑到内容的尽头时,再继续滑动,蒙层底部的页面会开始滚动,显然这 ...

  4. 页面用一个遮罩层显示加载，加载完后隐藏该div

    <div id="background" class="background" style="display: none; "> ...

  5. jq给页面添加覆盖层遮罩的实例

    先引入jq代码,然后代码如下: $(function(){ var docHeight = $(document).height(); //获取窗口高度 $('body').append('<d ...

  6. 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结

    史上最全的CSS hack方式一览 2013年09月28日 15:57:08 阅读数:175473 做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我 ...

  7. js添加遮罩层

    直接用代码来说明 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="MaskT ...

  8. 纯js制作遮罩层对话框 -- g皓皓

    //本文支持js在线工具测试.转载请注明出处. <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> < ...

  9. jQuery+CSS 简单代码实现遮罩层( 兼容主流浏览器 )

    /* ** jQuery版本:jQuery-1.8.3.min.js ** 浏览器:Chrome( v31.0.1650.63 m ),IE11,Firefox( v32.0.1 ),IETester ...

随机推荐

  1. 【Linux】鸟哥的Linux私房菜基础学习篇整理（五）

    1. type [-tpa] name:查看name命令是否为bash内置命令.参数:type:不加任何参数,type会显示出那么是外部命令还是bash的内置命令:-t:当加入-t参数时,type会通 ...

  2. MongoDB ‘conn’Mongo 对象远程代码执行漏洞

    漏洞名称: MongoDB ‘conn’Mongo 对象远程代码执行漏洞 CNNVD编号: CNNVD-201307-497 发布时间: 2013-07-25 更新时间: 2013-07-25 危害等 ...

  3. 安装配置MongoDB

    1.下载mongodb https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-2.6.8.tgz 2.解压 tar zxf mongodb-lin ...

  4. 图论(对偶图)：COGS 470. [NOI2010]海拔

    470. [NOI2010]海拔 ★★★☆   输入文件:altitude.in   输出文件:altitude.out   简单对比 时间限制:2 s   内存限制:512 MB 海拔 [问题描述] ...

  5. 使用yum快速升级CentOS 6.5内核到 3.10.28

    网上有不少升级CentOS内核的文章,如<CentOS 6.5 升级内核到 3.10.28>,大部分都是下载源码编译,有点麻烦. 在yum的ELRepo源中,有mainline(3.13. ...

  6. Java---注解、类加载器-加强-实现运行任意目录下class中加了@MyTest的空参方法

    做自己的类加载器 虚拟机的核心是通过类加载器来加载.class文件,然后进行相应的解析执行.那么我们可以自己做类加载器,手动加载需要的.class以进行解析执行,从而扩展虚拟机的功能. 以下内容摘自A ...

  7. SPJ

    1. ∏sno(δjno='j1'(spj))2. ∏sno(δpno='p1'(δjno='j1'(spj)))3. ∏sno(δjno='j1'(spj)∞δcolor='红'(p))4. ∏jn ...

  8. Interesting Punch-Bowl（优先队列）

    /** http://acm.nyist.net/JudgeOnline/problem.php?pid=547 题意: 有一个正方形的区域 区域上面有高度不同的1*1的立方体自然有凸有凹 凹的地方可 ...

  9. 从git上下载代码并导入eclipse

    主要分为两步: 1.先从git下载代码到本地git仓库 2.eclipse import导入存在的maven项目

  10. Linux 数学运算

    let 命令 a= b= let c=a+B echo $c let a++ let b++ echo $a $b []方法 a= b= echo $[a+b] echo $[$a+$b] (()) ...