Compatible with ie ff div layer open close drag mask move animation change height and width_javascript skills

1 Drag, mask, move, and change the size of the element

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>popper.w's code</title> <style type="text/css"> body{text-align:center} #dd{ margin:50px auto} #odiv{ width:400px; height:200px;border:1px dotted red; border:1px dashed green;} #odiv ul{ list-style:none; text-align:left; width:150px; font-size:11px;} #odiv ul li{height:25px; line-height:25px; border-bottom:1px dashed green;} #ho{ width:150px; height:150px; border:1px dotted red} </style> <div id="aa"> </div> <div id="test"> <h1 id="dd"> </h1>Just a Test<input type="button" id="test1" value="XslideUp-H"> <input type="button" id="test2" value="XslideDown-H"> <input type="button" id="test3" value="XslideUp-W"> <input type="button" id="test4" value="XslideDown-W"> <input type="button" id="test5" value="Xcover"> <input type="button" id="test6" value="Xmove"> <input type="button" id="test7" value="Xdrag"> </div> <div id="odiv"> <h1 id="oTitle"> </h1>When can you drag me?<ul> <li> </li>Author:popper.w<li> </li>Email:popper11@126.com<li> </li>QQ:84101340<li> </li>webSite: [url]www.hongwei2008.cn[/url]</ul> </div> <div id="ho"> </div>
[Ctrl A Select all Note:

If you need to introduce external Js, you need to refresh to execute
]

2 layers open Effect <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <style type="text/css"> body{} #main{width:500px; margin:100px; height:500px;border:1px solid red} #test{border:1px solid red;display:none;width:10px;height:10px; background:yellow} </style> <title> </title> Code By popper.w<input type="button" value="点击打开" id="bt"> <input type="button" value="点击关闭" id="bt1"> <div id="main"> <div id="test"> </div> </div>

[Ctrl A select all Note: If you need to introduce external Js, you need to refresh to execute ]