<!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. Android 使用SQLite存储以及读取Drawable对象

    在进行Android开发过程中,我们经常会接触到Drawable对象,那么,若要使用数据库来进行存储及读取,该如何实现? 一.存储 //第一步,将Drawable对象转化为Bitmap对象 Bitma ...

  2. 查看 Android App 的 versionCode

    有 App 源码时,可以直接查看 AndroidManifest.xml 文件. <manifest android:versionName="1.4" android:ve ...

  3. 【Oracle】恢复重做日志组

    我们在Oracle的日常运维中,有可能会遇到重做日志组丢失的情况.下面我将模拟丢失不同状态的日志组,并分别给出解决办法: 重做日志有以下几种状态,如下: -  CURRENT:此状态表示正在被 LGW ...

  4. WinDbg使用

    1.抓dump文件 程序崩溃(crash)的时候, 为了以后能够调试分析问题, 可以使用WinDBG要把当时程序内存空间数据都保存下来,生成的文件称为dump 文件. 步骤: 1) 打开WinDBG并 ...

  5. 时序分析：DTW算法（基于模板）

    对时序对象进行分析,使用KMP算法可以分析速率不变的模式,参考时序分析:欧式空间轨迹模式识别.使用基于模板匹配的方法,对于速率发生变化的模式,需要用新的对速率要求松散的方法,DTW方法为一种广泛使用的 ...

  6. 【sqli-labs】 less36 GET- Bypass MYSQL_real_escape_string (GET型绕过MYSQL_real_escape_string的注入)

    看一下mysql_real_escape_string()函数 \x00 \x1a 注入的关键还是在于闭合引号,同样使用宽字节注入 http://192.168.136.128/sqli-labs-m ...

  7. 来源页面地址 上一页面url

    Uri uri = Request.UrlReferrer;

  8. （转）基于Metronic的Bootstrap开发框架经验总结（6）--对话框及提示框的处理和优化

    http://www.cnblogs.com/wuhuacong/p/4775282.html 在各种Web开发过程中,对话框和提示框的处理是很常见的一种界面处理技术,用得好,可以给用户很好的页面体验 ...

  9. C# 聚合数据借口发短信的使用

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  10. Linux 帮助与语言设置以及(\)

    1.命令太长可以用反斜杠(\)来转义回车键,使用命令连续到下一行.注意:反斜杠后就立刻接着特殊字符才能转义. 2.修改语系为英文 LANG=en_US.utf8 export LC ALL=en_US ...