网页拖动模块，Js层拖拽，加减号收缩和展开

发布时间：2018-09-01 21:20:56 所属栏目：活动来源：站长网

导读：网页拖动模块，加减号紧缩和睁开，Js仿Google和Windows Live的拖拽，不单实现了网页模块的拖动，还可封锁、睁开、紧缩层窗口，自动排序，拖拽的时辰自动吸附到落点上，自动把位置分列整齐，极端服气作者啦。示例： HTMLHEADTITLE仿Google和Windows Live的

　　网页拖动模块，加减号紧缩和睁开，Js仿Google和Windows Live的拖拽，不单实现了网页模块的拖动，还可封锁、睁开、紧缩层窗口，自动排序，拖拽的时辰自动吸附到落点上，自动把位置分列整齐，极端服气作者啦。

　　示例：

<HTML> <HEAD> <TITLE>仿Google和Windows Live的拖拽</TITLE> <style type="text/css"> body { margin:10px; } #dragHelper { position:absolute;/*重要*/ border:2px dashed #000000; background-color:#FFFFFF; filter: alpha(opacity=30); } .normal { position:absolute;/*重要*/ width:300px; #height:10px; border:1px solid #666666; background-color:#FFFFFF; } .over { position:absolute;/*重要*/ width:300px; #height:10px; border:1px solid #666666; background-color:#f3f3f3; filter: alpha(opacity=50); } .dragArea { CURSOR: move; } </style> </HEAD> <BODY oncontextmenu="window.event.returnValue=false"> <input type="text" id="evt" name="eventValue" size="40" /> <div id="dragHelper" style="display:none"></div> <div class="normal" overClass="over" dragClass="normal"> <table width="100%"> <tbody> <tr bgcolor="#CCCCCC" bar="yes"><td><a href="#">baidu.com</a></td><td dragArea="yes" class="dragArea">........</td><td><a href="#" onclick="openClose(this)">-</a> x</td></tr> <tr><td colspan="3">地点:http://www.baidu.com</td></tr> <tr><td colspan="3">要害字:</td></tr> <tr><td colspan="3">声名:</td></tr> </tbody> </table> </div> <div class="normal" overClass="over" dragClass="normal"> <table width="100%"> <tbody> <tr bgcolor="#CCCCCC" bar="yes"><td>新浪</td><td dragArea="yes" class="dragArea">........</td><td><a href="#" onclick="openClose(this)">-</a> x</td></tr> <tr><td colspan="3">地点:http://www.sina.com.cn</td></tr> <tr><td colspan="3">要害字:</td></tr> <tr><td colspan="3">声名:</td></tr> </tbody> </table> </div> <div class="normal" overClass="over" dragClass="normal"> <table width="100%"> <tbody> <tr bgcolor="#CCCCCC" bar="yes"><td>源码</td><td dragArea="yes" class="dragArea">........</td><td><a href="#" onclick="openClose(this)">-</a> x</td></tr> <tr><td colspan="3">地点:http://www.veryhuo.com</td></tr> <tr><td colspan="3">要害字:</td></tr> <tr><td colspan="3">声名:</td></tr> </tbody> </table> </div> <div class="normal" overClass="over" dragClass="normal"> <table width="100%"> <tbody> <tr bgcolor="#CCCCCC" bar="yes"><td>QQ</td><td dragArea="yes" class="dragArea">........</td><td><a href="#" onclick="openClose(this)">-</a> x</td></tr> <tr><td colspan="3">地点:http://www.qq.com</td></tr> <tr><td colspan="3">要害字:</td></tr> <tr><td colspan="3">声名:</td></tr> </tbody> </table> </div> </BODY> <SCRIPT LANGUAGE="<b>Java</b>Script">  </SCRIPT> </HTML> <br /><center>如不能表现结果，请按Ctrl+F5革新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
提醒：可修改儿女码再运行!

（编辑：湖南网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!