据说是Google首页的网页模块拖动代码

所属分类：网络编程 / JavaScript 阅读数： 1448

收藏 0赞 0分享

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>据说是Google首页的网页模块拖动代码</title>   </head> <body >  <table id="dragTable" cellpadding="3" style=" border:solid 0px green;width:98%;"> <tr> <td valign="top" style="width:30%"> <div class="dragDiv" id="dragDiv1" > <table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue"> <tr id="titleBar1" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;"> <th align="left" unselectable="on" >Title1</th> </tr> <tr style="height:130px;padding:3px;" align="left" valign="top" > <td unselectable="on">这里的字比较长....我来了....中国....中国...外国.，看一下有没有溢出></td> </tr> </table> </div> <div class="dragDiv" id="dragDiv2"> <table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue"> <tr id="titleBar2" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;"> <th align="left" unselectable="on" >Title2</th> </tr> <tr style="height:130px;padding:3px;" align="left" valign="top" > <td unselectable="on">Content2...</td> </tr> </table> </div> </td> <td valign="top" style="width:50%"> <div class="dragDiv" id="dragDiv3"> <table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue"> <tr id="titleBar3" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;"> <th align="left" unselectable="on" >Title3</th> </tr> <tr style="height:230px;padding:3px;" align="left" valign="top" > <td unselectable="on">Content3...</td> </tr> </table> </div> </td> <td valign="top" style="width:20%"> <div class="dragDiv" id="dragDiv4"> <table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue"> <tr id="titleBar4" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;"> <th align="left" unselectable="on" >Title4</th> </tr> <tr style="height:130px;padding:3px;" align="left" valign="top" > <td unselectable="on">Content4...</td> </tr> </table> </div> <div class="dragDiv" id="dragDiv5"> <table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue"> <tr id="titleBar5" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;"> <th align="left" unselectable="on" >Title5</th> </tr> <tr style="height:130px;padding:3px;" align="left" valign="top" > <td unselectable="on">Content5...</td> </tr> </table> </div> </td> </tr> </table> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

更多精彩内容其他人还在看

据说是Google首页的网页模块拖动代码

javascript if条件判断方法小结

javascript教程:关于if简写语句优化的方法

wap浏览自动跳转到wap页面的js代码

jqGrid读取选择的多行的某个属性代码

让alert不出现弹窗的两种方法

JSON+HTML实现国家省市联动选择效果

javascript的alert box在java中如何显示多行

绑定回车enter事件代码

Jquery 返回json数据在IE浏览器中提示下载的问题

用jquery实现的一个超级简单的下拉菜单

网络赚钱

站长故事