学步园

function moveit(){ 
 if(down&&event.srcElement==obj){ 
   with(obj.style)
   { 
       posLeft=document.body.scrollLeft+event.x-x 
        posTop=document.body.scrollTop+event.y-y 
   } 
 } 
} 

function stopdrag()
{ 
    down=false  
    obj.style.zIndex=z      
    obj.releaseCapture() 
} 
</script> 

<div onmousedown=init() onmousemove=moveit() onmouseup=stopdrag() style="position:absolute;left:20;top:190;width:100;height:150;border:1px solid #000000;z-index:1;background:#eeeeee">Layer 1</div> 
<div onmousedown=init() onmousemove=moveit() onmouseup=stopdrag() style="position:absolute;left:60;top:10;width:100;height:150;border:1px solid #000000;z-index:2;background:#eeeeee">Layer 2</div> 
<div onmousedown=init() onmousemove=moveit() onmouseup=stopdrag() style="position:absolute;left:100;top:90;width:100;height:150;border:1px solid #000000;z-index:3;background:#eeeeee">Layer 3</div> 

<!--

本例需要掌握的技巧比较多，捕捉鼠标，获取鼠标位置(相当于对象)，释放鼠标捕捉，文档的滚动距离还有with 语句。 
1.       setCapture() 设置属于当前文档的对象的鼠标捕捉。 
2.       event.offsetX 设置或获取鼠标指针位置相对于触发事件的对象的 x 坐标。 
3.       event.offsetY 设置或获取鼠标指针位置相对于触发事件的对象的 y 坐标。 
4.       releaseCapture() 释放当前文档中对象的鼠标捕捉。 
5.       scrollLeft 设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离。 
6.       scrollTop 设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离。 
7.       with 为一个或多个语句设定默认对象。 

-->