手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >实现局部遮罩与关闭原理及代码
实现局部遮罩与关闭原理及代码
摘要:复制代码代码如下://实现局部遮罩functionShade(){vars=document.getElementById("shade")...

复制代码 代码如下:

//实现局部遮罩

<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>

【实现局部遮罩与关闭原理及代码】相关文章:

详解Node.js包的工程目录与NPM包管理器的使用

EasyUI闪屏EasyUI页面加载提示(原理+代码+效果图)

js操作css属性实现div层展开关闭效果的方法

超酷右下浮出广告窗口代码

实现DIV圆角的JavaScript代码

js中跨域方法原理详解

免费空间广告万能消除代码

js实现异步循环实现代码

JavaScript实现弹出模态窗体并接受传值的方法

jQuery Timelinr实现垂直水平时间轴插件(附源码下载)

精品推荐
分类导航