收录日期:2021/01/21 22:29:57 时间:2016/05/12 04:21:49 标签:JavaScript
http://akaney2k.51.net/Noname1.htm
就是实现 拖动那个层,移到下面表格的td上空时 td也可以变红
判断位置,在TD里时就变
IE5.5+能用

<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var curElement,wx,wy,cx,cy,sx,sy,px,py;
var oeventX,oeventY;
//=============================================
function doMouseDown() 
{
if ((event.button==1) && (event.srcElement.id=="oframe"))curElement = event.srcElement;

oeventX1=event.clientX;
oeventY1=event.clientY;
}

function doMouseMove(){
if ((event.button==1) && (curElement!=null)){ 
// 定位图层
newleft= oframe.offsetLeft+(event.clientX-oeventX1);

var obj=document.elementFromPoint(curElement.style.pixelLeft,curElement.style.pixelTop)
if(obj.tagName=="TD")obj.fireEvent("onmouseout");

if (newleft<0){newleft=0;}//自动调整层横坐标位置
curElement.style.pixelLeft=newleft;
oeventX1=event.clientX;

newtop=oframe.offsetTop+(event.clientY-oeventY1);
if (newtop<0){newtop=0;}//自动调整层纵坐标位置
curElement.style.pixelTop= newtop;
oeventY1=event.clientY;
event.returnValue = false;
event.cancelBubble = true;

var obj=document.elementFromPoint(curElement.style.pixelLeft,curElement.style.pixelTop)
if(obj.tagName=="TD")obj.fireEvent("onmouseover");
}
}

function window.onload(){
document.onmousedown = doMouseDown;
document.onmousemove = doMouseMove;
document.onmouseup = new Function("curElement =null")
}
//-->
</SCRIPT>
<style type="text/css">
<!--
.tdChangeColor {behavior:url(tdChangeColor.htc)}
-->
</style>
</HEAD>

<BODY BGCOLOR="#FFFFFF">
<div id="oframe" style="position:absolute;left:10;top:30;width:40;background-color:#cccccc">aaaaaaa</div>

<table width="300" border="1" cellspacing="3" cellpadding="3">
  <tr>
    <td class="tdChangeColor">&nbsp;</td>
    <td class="tdChangeColor">&nbsp;</td>
    <td class="tdChangeColor">&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td class="tdChangeColor">&nbsp;</td>
  </tr>
  <tr>
    <td class="tdChangeColor">&nbsp;</td>
    <td class="tdChangeColor">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>

</BODY>
</HTML>
可惜我浏览器是ie5 谢谢秋水弟弟 ^w^ akane再看看
如果不是IE5.5+,那就将tdChangeColor的代码提出来

<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var curElement,wx,wy,cx,cy,sx,sy,px,py;
var oeventX,oeventY;
//=============================================
function doMouseDown() 
{
if ((event.button==1) && (event.srcElement.id=="oframe"))curElement = event.srcElement;

oeventX1=event.clientX;
oeventY1=event.clientY;
}

function doMouseMove(){
if ((event.button==1) && (curElement!=null)){ 
// 定位图层
newleft= oframe.offsetLeft+(event.clientX-oeventX1);

var obj=document.elementFromPoint(curElement.style.pixelLeft,curElement.style.pixelTop)
if(obj.tagName=="TD")obj.runtimeStyle.backgroundColor='';

if (newleft<0){newleft=0;}//自动调整层横坐标位置
curElement.style.pixelLeft=newleft;
oeventX1=event.clientX;

newtop=oframe.offsetTop+(event.clientY-oeventY1);
if (newtop<0){newtop=0;}//自动调整层纵坐标位置
curElement.style.pixelTop= newtop;
oeventY1=event.clientY;
event.returnValue = false;
event.cancelBubble = true;

var obj=document.elementFromPoint(curElement.style.pixelLeft,curElement.style.pixelTop)
if(obj.tagName=="TD")obj.runtimeStyle.backgroundColor='#ff0000';

}
}

function window.onload(){
document.onmousedown = doMouseDown;
document.onmousemove = doMouseMove;
document.onmouseup = new Function("curElement =null")
}
//-->
</SCRIPT>
<style type="text/css">
<!--
.tdChangeColor {behavior:url(tdChangeColor.htc)}
-->
</style>
</HEAD>

<BODY BGCOLOR="#FFFFFF">
<div id="oframe" style="position:absolute;left:10;top:30;width:40;background-color:#cccccc">aaaaaaa</div>

<table width="300" border="1" cellspacing="3" cellpadding="3">
  <tr>
    <td class="tdChangeColor">&nbsp;</td>
    <td class="tdChangeColor">&nbsp;</td>
    <td class="tdChangeColor">&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td class="tdChangeColor">&nbsp;</td>
  </tr>
  <tr>
    <td class="tdChangeColor">&nbsp;</td>
    <td class="tdChangeColor">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>

</BODY>
</HTML>

我还以为是这个5.0下不能创建呢
document.elementFromPoint(curElement.style.pixelLeft,curElement.style.pixelTop)
原来是htc不能响应那样子fire的事件?

^o^ 好用了 加分
啊不行一给分就结贴了 是不是就不可以恢复了呀? 不好不好 稍后再给分 ^_^ 说话算数的
打错字了 上面的‘恢复‘应该是‘回复‘

请教指针数组问题! 制作Flash大小问题。在线等待。 连接数据库出现问题!!请大家帮忙~~~~ 高手帮忙看看啊,动态声明二维数组的问题 在win2003怎样配置在 \"IIS 中配置 SQL XML 支持\" 如何能对Excel产生的文件进行压缩? 请问高手:如何平滑升级J2EE应用程序? 《〈〈〈 问几个有关性能指标的问题 〉〉〉》 请问IEEE1394 与 USB接口有什么不同? 请教:怎样修改avi文件的帧速信息?? 好东东,赶快去呀,JAVA多媒体学习光盘ISO 为什么查不到结果 BREW2.0的浮点运算 请教高手:当进程内组件被配置成COM+应用程序之后测试程序结果不同是什么原因? 窗口句柄能不能跨进程使用!? 添加的问题 jsp页面中使用iframe导致连接被重置、重复执行两次的奇怪问题! 请问如何将sql server2000数据库中的表导入到sybase,在线等 关于MySQL在RED HAT 8.0下的安装问题。 如何做一个用在IE里的ToolBar? JAVA多媒体学习光盘ISO 请问如何判断出IIS不能正常运行或者出现异常,并且可以重新启动这个服务 再过三天就考试,高兴散分 vc中如何从注册表读REG_MULTI_SZ类型的值 我的Windows XP装完SP1后就进不去了,需要激活,拿一般的激活程序激活不了,怎么办? intellij+jboss应该怎样编译才能生成存根类???? 一个困扰了我半年的VB难题 如何对phpnuke等新闻文章管理软件迅速上手 求一个存储过程 用C#写的拿到虚拟目录的根目录可以发布,虚拟目录下的子目录不能发布,?