实现可动态改变宽度的表格简单方法

动态

<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="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="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="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";

//定义拖拉时鼠标指针样式
var ie6;
ie6 = (window.navigator.appVersion.indexOf("MSIE 6.") !=0)
if(ie6)
{
document.getElementById("a1").style.cursor='col-resize';
document.getElementById("a3").style.cursor='col-resize';
}
else
{
document.getElementById("a1").style.cursor='w-resize';
document.getElementById("a3").style.cursor='w-resize';
}
document.getElementById("a5").style.cursor='w-resize';

function mOut()
{
mYes="0"
}

function mUp()
{
mYes="0"
}

function

时间: 2024-08-31 22:01:14

实现可动态改变宽度的表格简单方法的相关文章

JavaScript动态改变div属性的实现方法_javascript技巧

本文实例讲述了JavaScript动态改变div属性的实现方法.分享给大家供大家参考.具体如下: 这里可以通过JS动态改变div属性,样式等 <script type="text/javascript"> var oBox = document.getElementById('box'); var oDiv = document.getElementById('div1'); var aInput = document.getElementsByTagName('input

程序运行过程中动态改变控件大小的方法

程序|动态|过程|控件 在程序运行期间改变控件大小要用到WindowsAPI函数以下是主要的代码 [DllImport("user32.dll", EntryPoint="GetWindowLong")] public static extern int GetWindowLong ( int hwnd, int nIndex ); [DllImport("user32.dll", EntryPoint="SetWindowLong&q

Android动态添加menu菜单的简单方法_Android

从menu按键开始,涉及以下3个方法: 1.onCreateOptionsMenu(Menu menu)2.onPrepareOptionsMenu(Menu menu)3.onOptionsItemSelected(MenuItem item) 方法名 触发时间onCreateOptionsMenu 进入Launcher后第一次点MENU按钮时触发onPrepareOptionsMenu 有两种情况:1.进入Launcher后第一次点MENU按钮触发onCreateOptionsMenu后调用

Android动态添加menu菜单的简单方法

从menu按键开始,涉及以下3个方法: 1.onCreateOptionsMenu(Menu menu)2.onPrepareOptionsMenu(Menu menu)3.onOptionsItemSelected(MenuItem item) 方法名 触发时间onCreateOptionsMenu 进入Launcher后第一次点MENU按钮时触发onPrepareOptionsMenu 有两种情况:1.进入Launcher后第一次点MENU按钮触发onCreateOptionsMenu后调用

js动态改变表格单元格内容例子

这是一个JavaScript与网页交互的简单实例,动态改变指定ID表格单元格的内容,通过select命令实现要改变的单元格,你会看到对应单元格的内容Ajax无刷新改变了,想学习Ajax功能的,这个例子比较容易看懂哦. 先来看JS部分代码  代码如下 复制代码 <script> var arr=new Array() arr[0]="这是改变后的内容一"; arr[1]="这是改变后的内容二"; arr[2]="这是改变后的内容三";

JavaScript动态改变网页图片大小

在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了.如果对每个插图都先进行缩放再插入的话,太麻烦了. 我前段时间写的一篇文章就遇到过这种事情,后来用CSS的overflow和max-width属性暂时解决了页面变形的问题.这种方法好处是简单,但坏处是会破坏某些细节的效果. 如overflow:hidden,意思是当内部元素宽度大于父框架时隐藏超出宽度的部分.这样做可能会是一些内容突然截断,被隐藏了,很对不起观众. 通过max-width属性限制文章插图最大宽度的话,需

JavaScript动态设置div的样式的方法_javascript技巧

有时候需要根据需要动态设置div的样式,当然对于稍有经验的javascript开发者来说,这一切都是那么的简单,但是对于初学者或者说没有相关经验的开发者来说可能就是一个不大不小的难关,下面就通过实例简单介绍一下如何实现此效果. 代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content=&quo

JS动态改变表格边框宽度的方法

 本文实例讲述了JS动态改变表格边框宽度的方法.分享给大家供大家参考.具体如下: 下面的JS代码通过表格对象的border属性修改表格边框宽度 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 <!DOCTYPE html> <html> <head> <script> function changeBorder() { document.getElementById('

jquery实现动态改变div宽度和高度

  这篇文章主要介绍了jquery实现动态改变div宽度和高度,效果非常不错,而且兼容性也很好,有需要的小伙伴可以参考下. 完整代码: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/x