jquery Add masking layer plug-in

This is the code for the plugin.

1$.fn.extend ({"Showcover": Function () {2     //the translucent layer of the cover layer3     var$div = $ ("<div class= ' cover ' ></div>");4$("Body"). Append ($div);5     //Gets the width and height of the window6     varwidth =$ (window). width ();7     //get the height of the document8     varHeight =$ (window). Height ();9     //Ten$div. CSS ({"width": Width,"Height": Height,"Top":0," Left":0 }); One  A     //Landing Layer -     var$holder = $ ( This); -     //calculate the coordinates of the landing layer the     varx = (width-$holder. Width ())/2; -     vary = ($ (window). Height ()-$holder. Height ())/2; -  -$holder. CSS ({"Top": Y," Left": X,"Display":"Block" }); +  -     // + $ (window). Resize (function () { A $holder. Closecover (); at $holder. Showcover (); -     }) -     return$holder; -},"Closecover": Function () { -$ (window). Unbind ("Resize"); -     if($(". Cover"). length >0) { in         //Remove cover Layer -$(". Cover"). Remove (); to     } +     //Hide Landing Layer -$( This). Hide (); the     return$( This); * } $})

View Code

Code for CSS

1 . Holder2         {3 width:300px;4 height:200px;5background-color:red;6Positionfixed;7 Display:none;8Z-index: -;9         }Ten          One . Cover A         { -background-Color:yellow; -Filter:alpha (opacity= -); theOpacity0.5; -Positionfixed; -              -}

View Code

This is an example

<! 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">"Mycover.css"Rel="stylesheet"Type="Text/css"/> <script src="Jquery-1.4.1.js"Type="Text/javascript"></script> <script src="Mycover.js"Type="Text/javascript"></script> <script type="Text/javascript">$ (function () {$ ("#wtest"). Showcover (). CSS ("Background-color","Blue"); $(": Button[value=close]"). Click (function () {$ (". Holder"). Closecover (); })        })    </script>"wtest"style="position:fixed; width:300px; height:300px ;">hahaaaaaaaaaa</div></body>View Code