写一个弹层很容易，写一个兼容ie6的谈层不易。
以下是兼容ie6的谈层代码。
<!DOCTYPE html> <html > <head> <meta charset="utf-8" /> <title>测试弹层</title> <link rel="stylesheet" href="http://k.thea.cn/templates/front/css/base.css" /> <style type="text/css"> #mask{position:fixed;z-index:1000;top :0;left:0;100%;height:100%;background-color:#000;filter:alpha(opacity=80);opacity:0.8;} #layer{position:fixed;z-index:1001;top:50%;left:50%;402px;background-color:#fff;} #layer .layer_in{padding:0 20px 20px;} #layer h4{height:49px;line-height:49px;border-bottom:1px solid #d0d6d9;} #layer h4 a{float:left;displaty:inline-block;height:49px;padding:0 20px;color:#333;font-size:14px;} #layer h4 a.cur{color:#cc0000;border-bottom:1px solid #cc0000;} #layer h4 a:hover{text-decoration:none;} #layer .con{padding:40px 20px 0;} #layer .con span{display:block;322px;height:284px;background:url('temp1.png') no-repeat;} #layer .close{float:right;21px;height:23px;margin-top:14px;background:url('temp2.png') no-repeat;} </style> </head> <body style="height:3000px;"> <div id="btn" style="margin:50px;100px;height:50px;line-height:50px;background-color:yellow;">点击我把...</div> <!--<div id="mask"></div> <div id="layer"> <div class="layer_in"> <h4><a class="cur" href="javascript:void(0);" class="btn_login">登录</a><a href="javascript:void(0);" class="btn_reg">注册</a><em class="close"></em></h4> <div class="con"><span></span></div> </div> </div>--> </body> <script type="text/javascript" src="../../js/jquery.js"></script> <script type="text/javascript"> $(function(){ $("#btn").click(function(){ //创建msk addPop(true); }) }) //判断 IE var isIE = function () { return !-[1,]; }(); //判断 IE6 var isIE6 = function () { var ua = navigator.userAgent.toLowerCase(); return isIE && /msie 6/.test(ua); }(); //添加 iframe var appendIframe = function (elem) { elem.innerHTML = '<iframe style="position:absolute;left:0;top:0;100%;height:100%;z-index:-1;border:0 none;filter:alpha(opacity=0)"></iframe>'; }; var addPop=function(hasMask){ if(hasMask){ var mask=document.createElement("div"); mask.id="mask"; var style=mask.style; //mask.style.cssText=""+gW+"px;height:"+gH+"px;"; if (isIE6) { document.documentElement.style.backgroundImage = 'url(about:blank)'; document.documentElement.style.backgroundAttachment = 'fixed'; } document.body.appendChild(mask); if (isIE6) { document.body.style.height = '100%'; style.position = 'absolute'; style.setExpression('top', 'IE=document.documentElement.scrollTop+"px"'); appendIframe(mask); } } var layer=document.createElement("div"); layer.id="layer"; layer.innerHTML=['<div class="layer_in">', '<h4><a class="cur" href="javascript:void(0);" class="btn_login">登录</a><a ', 'href="javascript:void(0);" class="btn_reg">注册</a><em class="close"></em></h4>', '<div class="con"><span></span></div></div>'].join(""); document.body.appendChild(layer); setFixed(layer); $(".close").click(function(){ document.body.removeChild(mask); document.body.removeChild(layer); }) } //设置居中 var setFixed = function (obj) { var style = obj.style, width = obj.offsetWidth, height =obj.offsetHeight; style.position = isIE6 ? 'absolute' : 'fixed'; if(isIE6){ style.setExpression('top','IE6=document.documentElement.scrollTop+document.documentElement.clientHeight/2+"px"'); } else { style.top = '50%'; } style.left = '50%'; style.marginLeft = -parseInt(width / 2) + 'px'; style.marginTop = -parseInt(height / 2) + 'px'; }; </script> </html>