<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ptml xmlns = "http://www.w3.org/1999/xhtml"> <pead> <meta http-equiv =" content-Type "content =" text/html; charset = gb2312 "/> <title> div hold, open, and close effect </title> <style type =" text/css "> body, span, div, td {font-size: 12px; line-height: 1.5em; color: # 849BCA;} # bodyL {float: left; width: 84px; margin-right: 2px;}. od {width: 80px; height: 25px; line-height: 25px; text-align: center; font-weight: bold; border: 2px solid # 849BCA; display: block; color: #547BC9; float: left; text-decoration: none; margin-top: 2px;}. od: link {background: # EEF1F8;}. od: visited {background: # EEF1F8;}. od: hover {background: # EEE;}. od: active {background: # EEE;} # fd {width: 500px; height: 200px; background: # EDF1F8; border: 2px solid # 849BCA; margin-top: 2px; margin-left: 2px; float: left; overflow: hidden; position: absolute; left: 0px; top: 0px; cursor: move; float: left;/* filter: alpha (opacity = 50 );*/}. content {padding: 10px ;}</style> </pead> <body> [open layer] [close layer] Move layer <</body> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]