社区
JavaScript
帖子详情
如何实现单元格大小的拖动
afdfgg
2004-11-22 10:50:19
想做一个类似office里面的工具栏,当鼠标移到两个单元格之间时,出现可以拖动的标志,通过拖动可以改变单元格的宽度。
...全文
182
1
打赏
收藏
如何实现单元格大小的拖动
想做一个类似office里面的工具栏,当鼠标移到两个单元格之间时,出现可以拖动的标志,通过拖动可以改变单元格的宽度。
复制链接
扫一扫
分享
转发到动态
举报
写回复
配置赞助广告
用AI写文章
1 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
JK_10000
2004-11-22
打赏
举报
回复
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>JK:支持民族工业,尽量少买X货</title>
<style>
.resizeDivClass
{
position:relative;
background-color:red;
width:2;
z-index:1;
left:expression(this.parentElement.offsetWidth-1);
cursor:e-resize;
}
</style>
<script language=javascript>
function MouseDownToResize(obj){
obj.mouseDownX=event.clientX;
obj.pareneTdW=obj.parentElement.offsetWidth;
obj.pareneTableW=theObjTable.offsetWidth;
obj.setCapture();
}
function MouseMoveToResize(obj){
if(!obj.mouseDownX) return false;
var newWidth=obj.pareneTdW*1+event.clientX*1-obj.mouseDownX;
if(newWidth>0)
{
obj.parentElement.style.width = newWidth;
theObjTable.style.width=obj.pareneTableW*1+event.clientX*1-obj.mouseDownX;
}
}
function MouseUpToResize(obj){
obj.releaseCapture();
obj.mouseDownX=0;
}
</script>
</head>
<body>
改变table的列宽度
<table id=theObjTable STYLE="table-layout:fixed" >
<tr bgcolor=cccccc >
<td valign=top >
<font class="resizeDivClass" onmousedown="MouseDownToResize(this);" onmousemove="MouseMoveToResize(this);" onmouseup="MouseUpToResize(this);"></font>
aaa</td>
<td valign=top >
<font class="resizeDivClass" onmousedown="MouseDownToResize(this);" onmousemove="MouseMoveToResize(this);" onmouseup="MouseUpToResize(this);"></font>
ddd</td>
<td valign=top >
<font class="resizeDivClass" onmousedown="MouseDownToResize(this);" onmousemove="MouseMoveToResize(this);" onmouseup="MouseUpToResize(this);"></font>
ddd</td>
</tr>
<tr>
<td>aaaa fdsa fda fdsa fdsa fdsa fdsa fdsa fda fdsa fdsafdsa fdsa fdsa a</td><td>bbbb</td><td>dddd</td>
</tr>
</table>
</body>
</html>
jQuery
实现
拖动
调整表格
单元格
大小
的代码实例
主要介绍了jQuery
实现
拖动
调整表格
单元格
大小
的代码实例,本文直接给出
实现
代码,需要的朋友可以参考下
拖动
table标题
实现
改变td的
大小
(css+js代码)
拖动
列宽的表格</title> <meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″> <style type=”text/css”><!– .bg td{ font-size:12px; text-align:left; line-height:...
基于jquery
实现
的web版excel
支持合并
单元格
,拆分
单元格
,支持插入
单元格
,删除
单元格
,支持整行整列选择
单元格
,自定义右键菜单,可以设置
单元格
数量,支持鼠标左键
拖动
调整
单元格
宽高,支持选中
单元格
输入文字,多个
单元格
设置字体,颜色,...
多形式报表源码
6.行列的添加/删除,显示/隐藏、
拖动
、排序、锁定行列等功能 7.对创建的报表支持包括xls、txt、csv、xml等多种导出文件格式, 同时支持资源本地化。 8 支持
单元格
公式运算。公式表达式中可以进行算术、关系、逻辑...
instrumentpanel:仪表板
实现
为具有可
拖动
和可调整
大小
的组件的网格
仪表板
实现
为具有可
拖动
和可调整
大小
的组件的网格。 动态添加组件,例如。 当面板接收到数据时,在将新
单元格
添加到网格之前尚未看到。 在线演示: : InstrumentPanel帮助: : 麻烦? 首先,请查阅在线帮助,上面...
JavaScript
87,910
社区成员
224,616
社区内容
发帖
与我相关
我的任务
JavaScript
Web 开发 JavaScript
复制链接
扫一扫
分享
社区描述
Web 开发 JavaScript
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章