可以拖动的表格

lihua2915

浏览: 783039 次
性别:
来自: 上海

最近访客更多访客>>

13916109998

sqsgalaxys

soyomo

tuyinbo

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

html脚本

效果图：可以用鼠标拖动两个框到页面的任意位置

<html>  
  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">  
<title>可以用鼠标拖动的表格</title>  
</head>  
  
<body>  
<SCRIPT LANGUAGE="JavaScript">  
<!--   
var currentMoveObj = null;    //当前拖动对象   
var relLeft;    //鼠标按下位置相对对象位置   
var relTop;   
function f_mdown(obj)   
{   
    currentMoveObj = obj;        //当对象被按下时，记录该对象   
    currentMoveObj.style.position = "absolute";   
    relLeft = event.x - currentMoveObj.style.pixelLeft;   
    relTop = event.y - currentMoveObj.style.pixelTop;   
}   
window.document.onmouseup = function()   
{   
    currentMoveObj = null;    //当鼠标释放时同时释放拖动对象   
}   
function f_move(obj)   
{   
    if(currentMoveObj != null)   
    {   
        currentMoveObj.style.pixelLeft=event.x-relLeft;   
        currentMoveObj.style.pixelTop=event.y-relTop;   
    }   
}   
  
//-->  
</SCRIPT>  
<BODY>  
<TABLE width="100" border=1 onselectstart="return false" style="position:absolute;left:50;top:50" onmousedown="f_mdown(this)" onmousemove="f_move(this)">  
<TR>  
    <TD bgcolor="#CCCCCC" align="center" style="cursor:move">title1</TD>  
</TR>  
<TR>  
    <TD align="center" height="60">content</TD>  
</TR>  
</TABLE>  
<TABLE width="100" border=1 onselectstart="return false" style="position:absolute;left:350;top:250" onmousedown="f_mdown(this)" onmousemove="f_move(this)">  
<TR>  
    <TD bgcolor="#CCCCCC" align="center" style="cursor:move">title2</TD>  
</TR>  
<TR>  
    <TD align="center" height="60">content</TD>  
</TR>  
</TABLE>  
</body>  
  
</html>

分享到：

鼠标点按钮，把文本框里的值输入到表格，表 ... | 手动在页面添加值到下拉列表而不刷新的demo

2009-11-06 12:46
浏览 964
评论(0)
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

可以拖动的表格

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

可以拖动的表格

评论

发表评论

相关推荐

10个 DIV+CSS 需要注意的问题

常用代码

常用js函数

CSS下拉菜单

鼠标点按钮，把文本框里的值输入到表格，表格美化

手动在页面添加值到下拉列表而不刷新的demo

javascript 参数传递 文本框

js设置页面背景色,设置背景图片

css 表格 table

禁止网页上的鼠标，键盘事件

JavaScript 函数

在html文件引入其它html文件的几种方法

div浮动在select上

CSS自动黄行

GIF进度条

http错误代码含义

Window.Open详解

javascript调用父窗口（父页面）的方法

js窗口&提示大全

window.open，自动打开新窗口并且自动关闭新窗口，可以作为增加点击率使用

最近访客更多访客>>

javascript 参数传递文本框