实现可动态改变宽度的表格简单方法
日期：2012-08-31 浏览次数：20890 次
<head>
< %
'生成 css 类 ，用于设置表格
cssClassName="t"
cssClassNameMaxID=400
cssClassNameMinID=1
minWidth=50
Response.Write "<style>"
Response.Write vbcrlf
for i=cssClassNameMinID to cssClassNameMaxID
Response.Write "." & cssClassName & i
Response.Write "{cursor:default;font-size:13;color:ff0000;width:" & (minWidth + i) & "}"
Response.Write vbcrlf
next
Response.Write "</style>"
% >
</head>
<body onmouseup="mUp();tmUp();">
<table border="0" cellpadding="0" id="table1" bgcolor=f0f0f0 cellspacing="0" >
<tr bgcolor=dddddd height=23>
<td style='border-bottom:1 solid #707070' background="http://blog.csdn.net/images/blog_csdn_net/precipitant/36234/o_h.gif" class="< %=cssClassName & "100"% >"> 保镖</td>
<td style='border-bottom:1 solid #707070' width=5 id="a1" align="center" onmousedown="mDown('1')" onmousemove="mMove('1');" onmouseup="mUp()" onmouseout="mOut();" ><img src=http://www.163design.net/a/s/"http://blog.csdn.net/images/blog_csdn_net/precipitant/36234/o_fgf.gif" border=0 height=23></td>
<td style='border-bottom:1 solid #707070' background="http://blog.csdn.net/images/blog_csdn_net/precipitant/36234/o_h.gif" align=center class="< %=cssClassName & "100"% >"> 厨师</td>
<td style='border-bottom:1 solid #707070' width=5 id="a3" onmousedown="mDown('3')" onmousemove="mMove('3');" onmouseup="mUp()" onmouseout="mOut();" ><img src=http://www.163design.net/a/s/"http://blog.csdn.net/images/blog_csdn_net/precipitant/36234/o_fgf.gif" border=0 height=23></td>
<td style='border-bottom:1 solid #707070' background="http://blog.csdn.net/images/blog_csdn_net/precipitant/36234/o_h.gif" align=center class="< %=cssClassName & "100"% >"> 司机</td>
<td style='border-bottom:1 solid #707070' width=5 id="a5" onmousedown="tmDown()" onmousemove="tmMove();" onmouseup="tmUp()" onmouseout="tmOut();" ><img src=http://www.163design.net/a/s/"http://blog.csdn.net/images/blog_csdn_net/precipitant/36234/o_fgf.gif" border=0 height=23></td>
</tr>
< %
rcount=1
for i=1 to 10
rcount=rcount+1
% >
<tr height=23>
<td style='border-bottom:1 solid #e0e0e0' class="< %=cssClassName & "100"% >" >
孙悟空
</td>
<td style='border-bottom:1 solid #e0e0e0'> </td>
<td style='border-bottom:1 solid #e0e0e0' class="< %=cssClassName & "100"% >" align=center >
猪八戒
</td>
<td style='border-bottom:1 solid #e0e0e0'> </td>
<td style='border-bottom:1 solid #e0e0e0' class="< %=cssClassName & "100"% >" align=center >
沙和尚
</td>
<td style='border-bottom:1 solid #e0e0e0'> </td>
</tr>
< %next% >
</table>
</body>
< script language=javascript>
var minWidth="<%=minWdith%>";
var cNameRoot="<%=cssClassName%>";
var rowCount="<%=rcount%>";
var mYes="0";
var mLeft;
var leftID0;
var rightID0;
var misAdjust=1.2 //用于调整误差
var tmYes="0";
< %
'生成 css 类 ，用于设置表格
cssClassName="t"
cssClassNameMaxID=400
cssClassNameMinID=1
minWidth=50
Response.Write "<style>"
Response.Write vbcrlf
for i=cssClassNameMinID to cssClassNameMaxID
Response.Write "." & cssClassName & i
Response.Write "{cursor:default;font-size:13;color:ff0000;width:" & (minWidth + i) & "}"
Response.Write vbcrlf
next
Response.Write "</style>"
% >
</head>
<body onmouseup="mUp();tmUp();">
<table border="0" cellpadding="0" id="table1" bgcolor=f0f0f0 cellspacing="0" >
<tr bgcolor=dddddd height=23>
<td style='border-bottom:1 solid #707070' background="http://blog.csdn.net/images/blog_csdn_net/precipitant/36234/o_h.gif" class="< %=cssClassName & "100"% >"> 保镖</td>
<td style='border-bottom:1 solid #707070' width=5 id="a1" align="center" onmousedown="mDown('1')" onmousemove="mMove('1');" onmouseup="mUp()" onmouseout="mOut();" ><img src=http://www.163design.net/a/s/"http://blog.csdn.net/images/blog_csdn_net/precipitant/36234/o_fgf.gif" border=0 height=23></td>
<td style='border-bottom:1 solid #707070' background="http://blog.csdn.net/images/blog_csdn_net/precipitant/36234/o_h.gif" align=center class="< %=cssClassName & "100"% >"> 厨师</td>
<td style='border-bottom:1 solid #707070' width=5 id="a3" onmousedown="mDown('3')" onmousemove="mMove('3');" onmouseup="mUp()" onmouseout="mOut();" ><img src=http://www.163design.net/a/s/"http://blog.csdn.net/images/blog_csdn_net/precipitant/36234/o_fgf.gif" border=0 height=23></td>
<td style='border-bottom:1 solid #707070' background="http://blog.csdn.net/images/blog_csdn_net/precipitant/36234/o_h.gif" align=center class="< %=cssClassName & "100"% >"> 司机</td>
<td style='border-bottom:1 solid #707070' width=5 id="a5" onmousedown="tmDown()" onmousemove="tmMove();" onmouseup="tmUp()" onmouseout="tmOut();" ><img src=http://www.163design.net/a/s/"http://blog.csdn.net/images/blog_csdn_net/precipitant/36234/o_fgf.gif" border=0 height=23></td>
</tr>
< %
rcount=1
for i=1 to 10
rcount=rcount+1
% >
<tr height=23>
<td style='border-bottom:1 solid #e0e0e0' class="< %=cssClassName & "100"% >" >
孙悟空
</td>
<td style='border-bottom:1 solid #e0e0e0'> </td>
<td style='border-bottom:1 solid #e0e0e0' class="< %=cssClassName & "100"% >" align=center >
猪八戒
</td>
<td style='border-bottom:1 solid #e0e0e0'> </td>
<td style='border-bottom:1 solid #e0e0e0' class="< %=cssClassName & "100"% >" align=center >
沙和尚
</td>
<td style='border-bottom:1 solid #e0e0e0'> </td>
</tr>
< %next% >
</table>
</body>
< script language=javascript>
var minWidth="<%=minWdith%>";
var cNameRoot="<%=cssClassName%>";
var rowCount="<%=rcount%>";
var mYes="0";
var mLeft;
var leftID0;
var rightID0;
var misAdjust=1.2 //用于调整误差
var tmYes="0";
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
