Example:
Copy codeThe Code is as follows:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Title> untitled document </title>
<Style>
# Screefull {display: block; border: 1px solid # bddbf3; width: 954px; padding: 3px 5px 7px; margin: 0 auto 10px; background: # fef9db ;}
# Mostrar {display: block; width: 954px; display: none ;}
# Screefull. close {display: block; width: 25px; height: 20px; background: url (img/cx.gif) no-repeat 0 0; overflow: hidden; float: right; margin: 16px 8px 0 0; * margin-right: 5px; text-decoration: none ;}
# Screefull p {display: block; text-align: center; font-family: "Microsoft Yahei"; font-size: 14px; color: #000; height: 28px; line-height: 28px; vertical-align: middle ;}
# Screefull var {display: inline-block; * display: inline; * zoom: 1; background: url (img/wicon.gif) no-repeat 0 0; width: 28px; height: 28px; overflow: hidden; vertical-align: middle; margin-right: 10px ;}
# Screefull em {display: inline-block; * display: inline; * zoom: 1; color: # ff0000; font-family: "Microsoft Yahei"; font-style: normal ;}
# Screefull span {display: inline-block; * display: inline; * zoom: 1; vertical-align: middle ;}
# Screefull p a {display: inline-block; * display: inline; * zoom: 1; color: # 2400ff; text-decoration: underline ;}
</Style>
<Script type = "text/javascript" src = "js/jquery. js"> </script>
</Head>
<Body>
<! -- Begin: 1 -->
<Div id = "warn" class = "scree clearfix" style = "display: none;">
<Div id = "screefull">
<A href = "#" class = "close" onclick = "closewarn ('close')"> [x] </a>
<P> <span> Add ad codes to <em> websites not approved </em> without commission. <A href = "#" target = "_ blank"> I understand </a> </span> </p>
</Div>
</Div>
<Script type = "text/javascript">
Function closewarn (type)
{
$ ("# Warn"). slideUp ("slow ");
If (type = 'know ')
{
$. Post (window. location. href, {op: 'setwarn'}, function (data)
{
Return true;
});
}
}
Window. onload = function ()
{
$ ("# Warn"). slideDown (2000 );
}
</Script>
<! -- End: 1 -->
</Body>
</Html>
Explain the above code snippet:
1. $ ("# warn"). slideUp ("slow"); slide up, $ ("# warn"). slideDown (2000); slide down
2. $. post (window. location. href, {op: 'setwarn'}, function (data)
{
Return true;
})
Ajax is used to submit and interact with the server,
The first parameter is the request address. The second parameter is the submitted parameter. The third parameter is the method called after the request is successful.
The value of the op parameter is the format of the setwarn json string.
The url corresponds to locaotion. href (obtain the address of the current page)
Data corresponds to the {op: setwarn} string
Success Functions
3. window. onload = function () {} is used. Generally, all functions written in <text/javascript> must be called on the body page, this function can be executed without waiting for the call on the body page.