<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>全屏div</title>

<style>

html,body {

    margin:0;

    height:100%;

}

#test {

    width:100%;

    height:100%;

    background-color:#000;

    position:absolute;

    top:0;

    left:0;

    z-index:2;

    opacity:0.3;

    /*兼容IE8及以下版本浏览器*/

    filter: alpha(opacity=30);

    display:none;

}

#log_window {

    width:200px;

    height:200px;

    background-color:#FF0;

    margin: auto;

    position: absolute;

    z-index:3;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    display:none;

}

</style>

<script>

function shield(){

    var s = document.getElementById("test");

    s.style.display = "block";

  //  var l = document.getElementById("log_window");

    //l.style.display = "block";

}

function cancel_shield(){

    var s = document.getElementById("test");

    s.style.display = "none";

    //var l = document.getElementById("log_window");

    //l.style.display = "none";

}

</script>

</head>

<body>

<a href="javascript:shield()">打开遮罩</a>

<div id="test"></div>

<div id="log_window">

<a href="javascript:cancel_shield()">关闭</a>

</div>

</body>

</html>

JS遮罩层的更多相关文章

  1. JS遮罩层弹框效果

    对于前端开发者来说,js是不可缺少的语言.现在我开始把我日常积累的一些js效果或者通过搜索自己总结的一些效果分享给大家,希望能够帮助大家一起进步,也希望大家能够多多支持! 1.今天我先分享一个遮罩层弹 ...

  2. html js 遮罩层

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. js 遮罩层 loading 效果

    //调用方法 //关闭事件<button onclick='LayerHide()'>关闭</button>,在loadDiv(text)中,剔除出来 //调用LayerSho ...

  4. js遮罩层弹出显示效果组件化

    1.在web开发中经常遇到遮罩层的效果,可以将这种常用方法通用化 function showid(idname){ var isIE = (document.all) ? true : false; ...

  5. js 遮罩层请稍后

    this.WaitMessage = function (msg) { $("<div class=\"datagrid-mask\"></div> ...

  6. js简单弹出层、遮罩层

    <html> <head> <title>js简单弹出层</title> <style> /*阴影边框效果*/ .box-shadow-1 ...

  7. JS+CSS简单实现DIV遮罩层显示隐藏【转藏】

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. 遮罩层的实现(纯js兼容版)

    这个代码是我以前测试时候的代码了,主要用到的知识点是opacity和filer分别实现 “标准浏览器”和IE浏览器下的半透明,使用js的document.body.offsetwidth 和scree ...

  9. js添加遮罩层

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

随机推荐

  1. 5.26 idea生成javadoc

  2. JWPL工具处理维基百科wikipedia数据用于NLP

    JWPL处理维基百科数据用于NLP 处理zhwiki JWPL是一个Wikipedia处理工具,主要功能是将Wikipedia dump的文件经过处理.优化导入mysql数据库,用于NLP过程.以下以 ...

  3. JavaScript+CSS交互

    当鼠标移动到小图片上时,小图片显示红色边框并在上面大图片显示相应大图片,效果如图: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans ...

  4. 递归删除List元素

    public List<Redenvelope> DeleteList(List<Redenvelope> list) { foreach (var item in list) ...

  5. HDU_2149_基础博弈sg函数

    Public Sale Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total ...

  6. Content-Encoding值

    Content-Encoding值 gzip 表明实体采用GNU zip编码 compress 表明实体采用Unix的文件压缩程序 deflate 表明实体是用zlib的格式压缩的 identity ...

  7. react构建前端项目方法汇总

    react简介: 一.使用react 创建一个PC端的项目 (a):使用 yemon 创建一个 webpack 的 react 的项目 控制台安装并且产看 yemon 的版本 yo -v (b): 全 ...

  8. idea+MAVEN项目

    一.首先创建一个maven项目 1.依次点击:File->New->Project 2.左侧面板选择maven(不要选择Create from archetype选项),如下图,点击Nex ...

  9. VBS正则表达式

    删除字符串中指定的内容 Dim pathStr, newPathStr pathStr = "c:\windows;%My%\tool;e:\test;%Tg%\ff;d:\mm" ...

  10. [luogu2414 NOI2011]阿狸的打字机 (AC自动机)

    传送门 Solution 我们知道AC自动机上如果有一点A的fail[A]->B那么B为A的一个后缀 那么我们的问题\((x,y)\)就变为在y中有多少个点直接或间接连向x的终止节点 如果写暴力 ...