您的位置:首页 > Web前端 > JavaScript

js可拖动的层div

2008-08-27 10:52 239 查看
<script>

function HidMoveF(obj)

{

var move = document.getElementById(obj);

move.style.display = "none";

}

function DisMoveF(obj)

{

var move = document.getElementById(obj);

move.style.display = "";

}

</script>

<a href="JavaScript:DisMoveF('testMove');">编辑新闻</a>

<span id="testMove" style='position:absolute; width:160px; height:89px; display:none; left: 458px; top: 104px;' onmousedown=MouseDown(this) onmousemove=MouseMove() onmouseup=MouseUp()><div style="text-align:right;background:red;"><a href="JavaScript:HidMoveF('testMove');">关闭</a></div>

<table width="100%" border="1" bgcolor="#FFFFFF">

<tr>

<td> </td>

<td> </td>

<td> </td>

</tr>

<tr>

<td> </td>

<td> </td>

<td> </td>

</tr>

<tr>

<td> </td>

<td> </td>

<td> </td>

</tr>

</table></span>

<script language=javascript>

var Obj;

function MouseDown(obj)

{

Obj=obj;

Obj.setCapture();

Obj.l=event.x-Obj.style.pixelLeft;

Obj.t=event.y-Obj.style.pixelTop;

}

function MouseMove()

{

if(Obj!=null)

{

Obj.style.left = event.x-Obj.l;

Obj.style.top = event.y-Obj.t;

Obj.style.filter="alpha(opacity=20)";

}

}

function MouseUp()

{

if(Obj!=null)

{

Obj.releaseCapture();

Obj.style.filter="alpha(opacity=100)";

Obj=null;

}

}

</script>

<script language="JavaScript" type="text/javascript">

var orgMouseX;

var orgMouseY;

var orgObjX;

var orgObjY;

function doDrag()

{

var myObject=document.all.myDiv;

var x=event.clientX;

var y=event.clientY;

myObject.style.left=x-(orgMouseX-orgObjX);

myObject.style.top=y-(orgMouseY-orgObjY);

}

function doMouseDown()

{

orgMouseX=event.clientX;

orgMouseY=event.clientY;

orgObjX=parseInt(document.all.myDiv.style.left);

orgObjY=parseInt(document.all.myDiv.style.top);

}

</script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: