javascript图层操作。图层移动 - javascript -

javascript图层操作。图层移动

时间:2010-01-26 23:29:54   来源:   评论:加载中...   点击:加载中...
//移动的图层,拖动1.<span style='position:absolute;width:200;height:200;background:red' onmousedown=MouseDown(this) onmousemove...

//移动的图层,拖动

1.<span style='position:absolute;width:200;height:200;background:red' onmousedown=MouseDown(this) onmousemove=MouseMove() onmouseup=MouseUp()>meizz</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;
   }
}
function MouseUp()
{
  if(Obj!=null)
   {
     Obj.releaseCapture();
     Obj=null;
   }
}
</script>
2.
<div id="myDiv" src="logo.gif" ondrag="doDrag();" onmouseover="this.style.cursor='hand'" style="position:absolute;left=100;top=100;" onmousedown="doMouseDown();">
<a href="#" onclick="return false"><h1>wlecome</h1></a>
</div>
<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>

 



相关热词搜索:

 
上一篇:javascript对文档进行操作
下一篇:javascript屏蔽按键和打印功能
收藏 将此文推荐给朋友
分享到: