<!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. A - Fox And Snake

    Problem description Fox Ciel starts to learn programming. The first task is drawing a fox! However, ...

  2. 5.23Java各种对象(PO,BO,VO,DTO,POJO,DAO,Entity,JavaBean,JavaBeans)的区分

    作者:https://www.cnblogs.com/lyjin/p/6389349.html PO:持久对象(persistent object):---po就是在Object/Relation M ...

  3. Scala——面向对象和函数式编程语言

    Scala Scala是一门运行时基于JVM的编程语言,具备函数式编程和面向对象特点. 基本知识 basics 任意词均可作为符号名,对于关键词,以反引号包裹,避免使用下划线,避免带美元符的名字. 声 ...

  4. 【SQL】DUAL表

    DUAL表是Oracle系统中对所有用户可用的一个实际存在的1行1列的表,这个表不能用来存储信息,在实际应用中仅用来执行SELECT语句.可以使用DUAL表来查询系统的信息. --dual是1行1列的 ...

  5. **ML : ML中的最优化方法

    前言:         在机器学习方法中,若模型理解为决策模型,有些模型可以使用解析方法.不过更一般的对模型的求解使用优化的方法,更多的数据可以得到更多的精度.         AI中基于归纳的方法延 ...

  6. andorid 查看OpenCv Mat的Debug信息

    在进行Android调试时,不能再Console显示Debug信息,只能在LogCat上显示,显示信息如下图: 代码段: public void printMat2Txt(Mat ElemM, Str ...

  7. 在Unity中json文件的解析方式

    using System.Collections; using System.Collections.Generic; using UnityEngine; using LitJson; using ...

  8. luoguP1725 琪露诺 单调队列

    DP 方程:$f[i]=max(f[j])+v[i]$ 转移范围:$i-r<=j<=i-l$ 由此我们得知,每次只有 $[i-r,i-l]$ 部分的 $f$ 值对新更新的答案会有贡献. 故 ...

  9. PAT_A1145#Hashing - Average Search Time

    Source: PAT A1145 Hashing - Average Search Time (25 分) Description: The task of this problem is simp ...

  10. eas之dep的前置脚本和后置脚本

    dep的前置脚本和后置脚本,什么时候写,是这样解释的:    前置脚本是在方法前执行,后置脚本是在方法后执行    1.比如保存扩展,如果你要在保存前校验某个字段的值,你要在前置脚本中写,如果要保存后 ...