实现局部遮罩与关闭原理及代码

 更新时间:2013年02月04日 09:50:15   作者:  
实现局部遮罩,或许对某些朋友有着特殊的意义。局部遮罩的原理很简单另外加上关闭就有着另一番的效果,本文将介绍实现方法,感兴趣的朋友可以了解下,或许对你有所帮助
复制代码 代码如下:

//实现局部遮罩
<script type="text/javascript">
function Shade(){
var s = document.getElementById("shade");
s.style.display = "block";
}
function Display(){
var d = document.getElementById("shade");
d.style.display = "none";
}
</script>
<style type="text/css">
#box{
width:400px;
height:300px;
position:relative;
margin:0px auto;
border:1px solid #000;
}
#shade{
width:400px;
height:300px;
background-color:gray;
position:absolute;
z-index:999;
left:0px;
top:0px;
-moz-opacity:0.5;/*Firefox*/
opacity:0.5;/*Opera*/
filter:alpha(opacity=50); /*IE*/
}
</style>
</head>

<body>
<div id = "box">
<a href = "javascript:Shade()">局部遮罩</a>
<div id = "shade"></div>
</div>
<a href = "javascript:Display()">遮罩消失</a>
</body>

相关文章

  • js变量以及其作用域详解

    js变量以及其作用域详解

    Javascript和Java、C这些语言不同,它是一种无类型、弱检测的语言。它对变量的定义并不需要声明变量类型,我们只要通过赋值的形式,可以将各种类型的数据赋值给同一个变量
    2012-01-01
  • JavaScript知识点总结(四)之逻辑OR运算符详解

    JavaScript知识点总结(四)之逻辑OR运算符详解

    这篇文章主要介绍了JavaScript知识点总结(四)之逻辑OR运算符详解的相关资料,在JavaScript中,逻辑OR运算符用||表示。本文介绍的非常详细,具有参考借鉴价值,感兴趣的朋友一起看看吧
    2016-05-05
  • 动态加载dtree.js树treeview(示例代码)

    动态加载dtree.js树treeview(示例代码)

    本篇文章主要是对动态加载dtree.js树treeview的示例代码进行了详细的分析介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2013-12-12
  • JS基于正则截取替换特定字符之间字符串操作示例

    JS基于正则截取替换特定字符之间字符串操作示例

    这篇文章主要介绍了JS基于正则截取替换特定字符之间字符串操作方法,结合具体实例形式分析了JS基于正则实现针对特殊字符、数字等字符串类型的截取操作相关技巧,需要的朋友可以参考下
    2017-02-02
  • javascript实现可拖动变色并关闭层窗口实例

    javascript实现可拖动变色并关闭层窗口实例

    这篇文章主要介绍了javascript实现可拖动变色并关闭层窗口的方法,涉及javascript操作层的样式与属性的相关技巧,需要的朋友可以参考下
    2015-05-05
  • JS画图(非VML)--兼容IE/FF

    JS画图(非VML)--兼容IE/FF

    JS画图(非VML)--兼容IE/FF...
    2006-12-12
  • Layui实现数据表格中鼠标悬浮图片放大效果,离开时恢复原图的方法

    Layui实现数据表格中鼠标悬浮图片放大效果,离开时恢复原图的方法

    今天小编就为大家分享一篇Layui实现数据表格中鼠标悬浮图片放大效果,离开时恢复原图的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • 用JavaScrpt实现文件夹简单轻松加密的实现方法图文

    用JavaScrpt实现文件夹简单轻松加密的实现方法图文

    电脑里经常会存储着重要文件,这些文件需要进行加密,有许多方法来实现。但如果想对一个文件夹里的所有文件都进行加密,数量少还可以,要是数量多岂不是得把人累死?
    2008-09-09
  • javascript代码压缩工具的原理

    javascript代码压缩工具的原理

    JavaScript代码压缩对代码进行一系列优化处理,从而减小代码的体积,提高网页的加载速度,JavaScript代码压缩的原理包含去除代码中的空格、注释、不必要的换行符等无用字符,压缩变量名、压缩函数名等操作,将一些常见的操作(如+、-、*、/)转换成更短的操作符(如@、^、#、|)
    2023-12-12
  • js 输出内容到新窗口具体实现代码

    js 输出内容到新窗口具体实现代码

    js 输出内容一般都是在本窗口,如果要实现在新窗口的话该如何实现呢?下面与大家分享具体的代码
    2013-05-05

最新评论