The chic navigation created by jQuery has a highlighted window with shadow background

:
 
Html link:
Copy codeThe Code is as follows:
<A href = "#" rel = "registerwindow" class = "model"> Registration </a>

Css:
Copy codeThe Code is as follows:
Img {border: 0px ;}
# Registerwindow {width: 600px; height: 400px; top: 50px; right: 100px; background: # FFF; display: none; border: 5px #999 solid; position: absolute; z-index: 999 ;}
# Modelshade {width: 100%; height: 100%; background: #000; display: none; position: absolute; top: 0px; z-index: 0 ;}

I. Create and call mode window
Copy codeThe Code is as follows:
<Div id = "registerwindow">
<H1 align = "center"> Registration <Div style = "width: 250px; margin: 0 auto;">
<Form>
Username: <input type = "text" name = "username" size = "20"> <br>
Password: <input type = "password" name = "password" size = "20"> <br>
<Input type = "submit" name = "submit" value = "register">
</Form>
</Div>
</Div>

1. Create a jQuery statement and select a trace tag with a certain pattern.
Copy codeThe Code is as follows:
<Script>
$ ('Document'). ready (function (){
<! -- Register model start -->
$ ('A. model'). click (function (){

2. Use the following function to store the variables in the current project as values of the rel attribute.
Copy codeThe Code is as follows:
Var modelID = $ (this). attr ('rel ');

3. Set the effect of the window in the mode and add an image link to close the window.
Copy codeThe Code is as follows:
$ ('#' + ModelID ). fadeIn (2000 ). prepend ('<a href = "#" class = "close"> </a> ');
Certificate ('.close_button'0000.css ({'margin-left': '535px ', 'margin-top': '0px '});

Ii. Create a shadow background
Copy codeThe Code is as follows:
Certificate ('your modelshade'0000.css ('opacity ', '0. 8'). fadeIn (2000 );

3. Close the mode window
Copy codeThe Code is as follows:
$ ('A. close, # modelshade '). click (function (){
Var thismodelID = $ ('A. close'). parent (). attr ('id ');
$ ('# Modelshade, #' + thismodelID). fadeOut (function (){
$ ('A. close, # modelshade '). remove ();
});
Return false;
});

Close the failed connection of the click function. This method will keep the connection and try to load another page to the browser.
Copy codeThe Code is as follows:
Return false;

});
<! -- Register model end -->

Lt;/script>