Freeze table
来源：互联网 发布：你初到大城市知乎 编辑：程序博客网 时间：2024/06/04 01:18
<!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>= Freeze = Table</title><style type="text/css">div.freeze{ border:solid 1px; width:800px; overflow:hidden;}div.horizontal{ overflow-x:hidden; overflow-y:scroll; height:90px;}div.freeze table.schema{}div.freeze table.schema table.freeze{}div.freeze table.schema table.data{ position:relative;}div.freeze table.schema td.col{ padding:1px 0px 1px 1px; position:relative; vertical-align:top; overflow:hidden;}div.freeze table.schema td.left{}div.freeze table.schema td.right{}div.freeze table.schema td.col thead{}div.freeze table.schema td.col thead tr{}div.freeze table.scroll{ width:100%;}div.freeze table.scroll td.col{ text-indent:6px; line-height:14px; font-size:14px; border:solid 1px #aaaaaa; width:21px; height:21px; cursor:pointer;}div.freeze table.scroll td.scroll{ position:relative; border:solid 1px #aaaaaa; background-color:#eeeeee; vertical-align:top;}div.freeze table.scroll div.scroll{ position:absolute; width:18px; height:20px; border:solid 1px #333333; background-color:#999999; cursor:w-resize;}</style><script type="text/javascript" language="javascript">var IsIE = (navigator.appName=="Microsoft Internet Explorer");var GetEvent = IsIE ? function(base) { return window.event; } : function(base) { return (base.length > 0 && (base[0].constructor == Event || base[0].constructor == MouseEvent)) ? base[0] : null; };var GetEventElement = function(base) { var ev = GetEvent(base); if (ev == null) return null; return IsIE ? ev.srcElement : ev.target; };function moveTo(navi, arg) { var event = GetEvent(arg); var table = document.getElementById("tdData"); //var width = parseInt(table.clientWidth) - parseInt(table.parentNode.offsetLeft); var width = parseInt(navi.clientWidth) + 40; var left = parseInt(width * (event.x || event.layerX) / navi.clientWidth); if (left < 20) left = 0; if (width - left < 20) left = width; table.style.left = (0-left) + "px";}</script></head><body><div class="freeze"><div class="--horizontal"><table class="schema" cellpadding="0" cellspacing="0" border="0"><tr><td class="col left"> <table class="freeze" id="tbFreeze" cellpadding="0" cellspacing="0" border="1" rules="all" width="350px;"> <thead> <tr> <th style="width:50px;">ID</th> <th style="width:300px;">Name</th> </tr> </thead> <tr> <td>1</td> <td>CYBERGUYS/EFILLIATE</td> </tr> <tr> <td>2</td> <td>EXECUTIVE OFFICE FURNITURE</td> </tr> <tr> <td>3</td> <td>GLOBAL EQUIPMENT COMPANY</td> </tr> <tr> <td>4</td> <td>KENNY PRODUCTS, INC.</td> </tr> <tr> <td>5</td> <td>PREMIER ELECTION SOLUTIONS</td> </tr> </table></td><td class="col right"> <table class="data" id="tdData" cellpadding="0" cellspacing="0" border="1" rules="all" width="900px;"> <thead> <tr> <th style="width:450px;">Description</th> <th style="width:450px;">Description</th> </tr> </thead> <tr> <td>1321 White Rock Road, Rancho Cordova, CA 95742-6505</td> <td>1321 White Rock Road, Rancho Cordova, CA 95742-6505</td> </tr> <tr> <td>241 East Hamilton St, Tallahassee, FL 32301</td> <td>241 East Hamilton St, Tallahassee, FL 32301</td> </tr> <tr> <td>"2505 Mill Center Parkway, Suite 100, Buford, GA 30518"</td> <td>"2505 Mill Center Parkway, Suite 100, Buford, GA 30518"</td> </tr> <tr> <td>13309 S. Normandie Avenue, Gardena, CA 90249</td> <td>13309 S. Normandie Avenue, Gardena, CA 90249</td> </tr> <tr> <td>1253 Allen Station Parkway, Allen, TX 75002</td> <td>1253 Allen Station Parkway, Allen, TX 75002</td> </tr> </table></td></tr></table></div><table class="scroll" cellpadding="0" cellspacing="0" border="0" rules="none"> <tr> <td style="width:350px;">1,2,3</td> <td class="col"><</td> <td class="scroll" onclick="moveTo(this, arguments);"><div class="scroll"></div></td> <td class="col">></td> </tr></table></div></body></html>
