Introduction to jquery fade-in and fade-out
This article mainly introduces a simple example of jquery fade-in and fade-out effect. If you need some help, please refer to it.
Style:
The Code is as follows:
<Style type = "text/css">
# Win {
Width: 98%;
Position: absolute;
Display: none;
Float: left;
}
/* Control the location of the close button */
# Close {
Margin-left: 155px;
Cursor: pointer;
}
</Style>
JS Code:
The Code is as follows:
<Script type = "text/javascript">
Function showwin (){
$ ("# Win"). fadeIn ("slow ");
}
Function hide (){
$ ("# Win"). fadeOut ("slow ");
}
</Script>
Html code:
The Code is as follows:
<Div id = "win">
<Div id = "title">
<Table style = "width: 100%; background: # 78b3ef" cellpadding = "4" cellspacing = "1">
<Tr>
<Td> ID </td>
<Td> website name </td>
<Td> domain name </td>
<Td> Baidu indexing </td>
<Td> whether a link exists </td>
<Td> <span id = "close" onclick = "hide ()"> close </span> </td>
</Tr>
<Tr style = "background: # FFFFFF;">
<Td> <span id = "w_id"> </span> </td>
<Td> <input id = "txt_title" type = "text" style = "width: 237px"/> </td>
<Td> <input id = "txt_classurl" type = "text" style = "width: 259px"/> </td>
<Td> <span id = "w_baidu"> </span> </td>
<Td> <input id = "txt_exist" type = "text" style = "width: 83px"/> </td>
<Td> <input id = "Button1" type = "button" value = "modify" onclick = "w_modify ()"/> </td>
</Tr>
<Tr style = "background: # FFFFFF;"> <td colspan = "6"> <a href = "Default. aspx "> back to homepage </a> </td> </tr>
</Table>
</Div>
</Div>