asp.net页面弹出层 背景变灰的实现方法
在很多的图片站中,都会见到这样的效果:
点击某个图片,弹出一个层来显示大图,然后背景变灰,其它内容就点不动了。
本节也实现一个这样的效果,有兴趣的朋友,参考下。
1,aspx页面:
{
display: none;
position: absolute;
top: 0px;
left: 0px;
right:0px;
background-color: #777;
filter:progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75)
opacity: 0.6;
}
#ElseAddressDiv
{
width: 700px;
height: 290px;
position:absolute;
padding: 10px;
vertical-align: middle;
border: solid 3px #ff8300;
z-index: 10001;
display: none;
background-color:White;
}
<div id="bgDiv">
</div>
<div id="ElseAddressDiv">
<div>
2,js代码:
<script>
function invokeOpen()
{
document.getElementById("ElseAddressDiv").style.display="block";
//背景
var bgObj=document.getElementById("bgDiv");
bgObj.style.display="block";
bgObj.style.width = document.body.offsetWidth + "px";
bgObj.style.height = screen.height + "px";
//定义窗口
//var msgObj=document.getElementById("ElseAddressDiv");
//msgObj.style.marginTop = -75 + document.documentElement.scrollTop + "px";
}
function invokeClose()
{
document.getElementById("ElseAddressDiv").style.display="none";
document.getElementById("bgDiv").style.display="none";
//document.getElementById("CheckElseAddress").setAttribute("checked","false");
//document.getElementById("MoRenAddress").setAttribute("checked","true");
}
</script>
您可能感兴趣的文章:
asp.net页面弹出层 背景变灰的实现方法
photoshop处理曝光不足拍灰日出风景照后期调色教程
photoshop基础图层与蒙版使用技巧心得
Photoshop快速制作一个有渐层颜色覆盖的背景教程
photoshop快速制作简约的双色调背景图片教程
photoshop设计灰色高光质感金属文字效果制作教程
jQuery的弹窗插件 wBox
html5和css3 动态气泡按钮的实现
photoshop常用抠图工具使用经验技巧分享
photoshop快速选择工具选用技巧分享