弹出遮罩层

最新推荐文章于 2024-07-30 10:56:44 发布

sssjjjpppsjp

最新推荐文章于 2024-07-30 10:56:44 发布

阅读量205

点赞数

分类专栏： JS 文章标签： function xhtml div javascript html filter

JS 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>ces</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script>
function _(id) {
return document.getElementById(id);
}
var ti = null;
function loading(){
    var tmd = 0;
    var x1 = document.documentElement.clientWidth;
    var y1 = document.body.offsetHeight;
    var y2=document.documentElement.clientHeight;//整个页面的高度
    with(_("divzz")){
       style.width=x1+"px";
       if(y2>y1){
       style.height=y2+"px";
       }else{
       style.height=y1+"px";
       }
       style.overflowX="hidden";
       style.overflowY="hidden";
       style.visibility="visible";
    }
    _("divzz").style.left=0;
    _("divzz").style.filter='Alpha(Opacity=0)';
    document.body.style.overflowX="hidden";
    document.body.style.overflowY="hidden";
    _("divshowc").style.top=parseInt(document.documentElement.scrollTop)+((document.documentElement.clientHeight-250)/2)+"px";
    _("divshowc").style.left="50%";
    _("divshowc").style.marginLeft="-190px"
    _("divshowc").style.visibility="visible";
    ti = setInterval("hei()",10);
}
var x = 0;
function hei(){
    x+=10;
    if(x<31){
        if(document.all){
            _("divzz").style.filter='Alpha(Opacity='+x+')';
        }else{
            _("divzz").style.opacity=""+x/100+"";
        }
    }
}
function unload(){
_("divzz").style.visibility="hidden";
_("divshowc").style.visibility="hidden";
clearInterval(ti);
x=0;
}
</script>
<style>
*{
    padding: 0;
     margin: 0;
}
div{
background-color:#fff;
}
#divzz{
position:absolute;
visibility:hidden;
filter:alpha(opacity=70);
background-color:#a6a6a6;
z-index:9;
}
#divshowc{
position:absolute;
width:371px;
height:auto;
border:2px #aeddf1 solid;
visibility:hidden;
left:expression((body.clientWidth-300)/2);
background-color:#CCCCCC;
text-align:center;
z-index:10;
}
#top{
background-color:#eef7fe;
height:23px;
border-bottom:1px #aedef2 solid;
text-align:right;
}
</style>
</head>
<body>
<div id="divzz" align="center"></div>
<div id="divshowc"> 
    <div id="top"><img src="http://www.wotuitui.com/images/close.gif" style="cursor:hand;" onClick="unload();" alt="点击关闭"/></div>
<div><br/><br/><br/>内容<br/><br/><br/><br/><br/></div>
</div> 
<a href="javascript:loading();">打开</a>
</body>
</html>

sssjjjpppsjp

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
弹出遮罩层

<br /><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br /><html xmlns="http://www.w3.org/1999/xhtml"> <br /><head> <br /><title>ces</title> <br /><meta http-equiv="Content-Type" co
复制链接

扫一扫

专栏目录