드래그 레이어_자바스크립트 팁

<title>드래그 레이어</title> <style> td{font-size:12px;} /*模拟窗体*/ .vwin{ position:absolute; border-top: 2px outset buttonhighlight; border-left: 2px outset buttonhighlight; border-bottom: 2px outset buttonshadow; border-right: 2px outset buttonshadow; } .vwintit{height:18px;background-color:#000099;color:#ffffff;font-weight:bold;cursor:move;} .vwinbody{background-color:#D6D3CE;} </style> <table id="win01" class="vwin" width="300" height="200" cellspacing="0" cellpadding="0" border="0"> <tr> <td class="vwintit" forid="win01"> 窗口一</td> </tr> <tr> <td class="vwinbody" forid="win01"> </td> </tr> </table> <table id="win02" class="vwin" width="300" height="200" cellspacing="0" cellpadding="0" border="0"> <tr> <td class="vwintit" forid="win02"> 窗口二</td> </tr> <tr> <td class="vwinbody" forid="win02"> </td> </tr> </table> <table id="win03" class="vwin" width="300" height="200" cellspacing="0" cellpadding="0" border="0"> <tr> <td class="vwintit" forid="win03"> 窗口三</td> </tr> <tr> <td class="vwinbody" forid="win03"> </td> </tr> </table>
[Ctrl A select all 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다

]<script> //This javascript was writen by dron var md=false,mobj,ox,oy,index=1000; function document.onmousedown(){ winfocus(); if(event.srcElement.className=="vwintit") { md = true; mobj = document.getElementById(event.srcElement.forid); ox = mobj.offsetLeft - event.x; oy = mobj.offsetTop - event.y; } } document.onmouseup=function(){md=false;} function document.onmousemove() { if(md) { mobj.style.left = event.x + ox; mobj.style.top = event.y + oy; } } function winfocus() { fobj=document.getElementById(event.srcElement.forid); if(fobj==null){return false} if(fobj.style.zIndex!=index) { index = index + 1; fobj.style.zIndex=index; } } document.onclick=winfocus; </script>