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. Codeforces Round #316 (Div. 2)

    A. Elections time limit per test 1 second memory limit per test 256 megabytes input standard input o ...

  2. HDOJ(HDU) 2143 box(简单的多次判断-用的卫条件)

    Problem Description One day, winnie received a box and a letter. In the letter, there are three inte ...

  3. CentOS squid代理内网主机上网 openVpn配置

  4. Huffman编码实现电文的转码与译码

    //first thing:thanks to my teacher---chenrong      Dalian Maritime university /* 构造Huffman Tree思路: ( ...

  5. logback 配置详解(一)(转)

    转自:http://blog.csdn.net/haidage/article/details/6794509/ 一:根节点<configuration>包含的属性: scan: 当此属性 ...

  6. UVA 11212 IDA*

    移动一块连续的区间使得数列递增.问最少次数. 直接IDA*暴搜,只是我没有想到A*函数,所以就随手写了个连续递增块数作为估价函数,WA了,然后除以2,还是WA,除以3,WA,除以4...过了= = # ...

  7. 计算任意位数的Pi

    当用程序实现求pi的值时,也许你能够很快写出算法(利用求pi的几个公式),但是由于使用单变量保存结果,限于计算机硬件对变量的表示范围有限,因此,最多只能计算出pi值小数点后十多位.但需要得到一个更大位 ...

  8. Android Touch系统简介(二):实例详解onInterceptTouchEvent与onTouchEvent的调用过程

    上一篇文章主要讲述了Android的TouchEvent的分发过程,其中有两个重要的函数:onInterceptTouchEvent和onTouchEvent,这两个函数可被重装以完成特定的逻辑.on ...

  9. 新一代 PHP 加速插件 Zend Opcache <转>

    注: 由于原链接已不存在, 所以我把图片重新整理了一下, 以便看起来更加直观 笔者注: 1>  PHP 性能提升之 PHP NG  =>  php next generation wiki ...

  10. Codeforces 540D Bad Luck Island - 概率+记忆化搜索

    [题意] 一个岛上有三种生物A,B,C,各有多少只在输入中会告诉你,每种最多100只 A与B碰面,A会吃掉B, B与C碰面,B会吃掉C, C与A碰面,C会吃掉A...忍不住想吐槽这种环形食物链 碰面是 ...