Click to eject the center of the mask layer and darken the background

Click the pop-up layer effect code, the page already has a lot of similar code, the use of a very broad, the code first to determine the browser version, IE6 created div style and non-IE6 created div style in the parsing a little difference, for compatibility considerations, only added judgment, although the implementation of a bit rough, However, from the implementation of the method, easy to understand, easy to modify the perfect.

<! DOCTYPE HTML Public"-//W3C//DTD XHTML 1.0 transitional//en" "HTTP://WWW.W3.ORG/TR/XHTML1/DTD/XHTML1-TRANSITIONAL.DTD"> "http://www.w3.org/1999/xhtml"> "Content-type"Content="text/html;charset=gb2312"> <style type="Text/css">. Hidden{display:none;} #smallLay {width:498px; height:100px;padding:4px 10px 10px;background-color: #FFFFFF; border:1px solid #05549d; color:#333333; line-height:24px;text-align:left;-webkit-box-shadow:5px 2px 6px # the;-moz-box-shadow:3px 3px 6px #555;} </style> <script type="Text/javascript">function Showid (idname) {varIsie = (document.all)?true:false; varIsIE6 = Isie && ([/msie (\d) \.0/i.exec (navigator.useragent) [0][1] ==6); varnewbox=document.getElementById (idname); Newbox.style.zIndex="9999"; Newbox.style.display="Block"newbox.style.position=!isie6?"fixed":"Absolute"; Newbox.style.top=newbox.style.left ="50%"; Newbox.style.marginTop=-Newbox.offsetheight/2+"px"; Newbox.style.marginLeft=-Newbox.offsetwidth/2+"px"; varLayer=document.createelement ("Div"); Layer.id="Layer"; Layer.style.width=layer.style.height="100%"; Layer.style.position=!isie6?"fixed":"Absolute"; Layer.style.top=layer.style.left=0; Layer.style.backgroundColor="#000"; Layer.style.zIndex="9998"; Layer.style.opacity="0.6";    Document.body.appendChild (layer); varSel=document.getelementsbytagname ("Select");  for(varI=0; i<sel.length;i++) {sel[i].style.visibility="Hidden"; } function Layer_iestyle () {layer.style.width=Math.max (Document.documentElement.scrollWidth, Document.documentElement.clientWidth)+"px"; Layer.style.height= Math.max (Document.documentElement.scrollHeight, document.documentElement.clientHeight) +"px"; } function Newbox_iestyle () {Newbox.style.marginTop= Document.documentelement.scrolltop-newbox.offsetheight/2+"px"; Newbox.style.marginLeft= Document.documentelement.scrollleft-newbox.offsetwidth/2+"px"; }    if(Isie) {Layer.style.filter ="Alpha (opacity=60)";} if(isIE6) {Layer_iestyle () Newbox_iestyle (); Window.attachevent ("onscroll", function () {Newbox_iestyle (); }) Window.attachevent ("onresize", Layer_iestyle)} Layer.onclick=function () {newbox.style.display="None"; layer.style.display="None"; for(varI=0; i<sel.length;i++) {sel[i].style.visibility="Visible"; }}    }    </script> "Button"Id="showbtn"Name="showbtn"Value="dot i pop up layer"onclick="showid (' Smalllay ');"> <div id="Smalllay"style="Display:none;"><p align="Center"> This effect by <a href="http://tssljc.com/"target="_blank"> Qinhuangdao Lightweight Partition Board </a> 丨 tssljc.com collected on the internet, only for interest and learning exchange, not for commercial purposes. </p> </div> </body> 
Click to eject the center of the mask layer and darken the background