這篇文章主要介紹了JS實現動態移動層及拖動浮層關閉的方法,可實現動態拖動浮動窗口及關閉窗口的功能,非常具有實用價值,需要的朋友可以參考下
本文實例講述了JS實現動態移動層及拖動浮層關閉的方法。分享給大家供大家參考。具體實現方法如下：
- <html>
- <head>
- <title>動態移動的層</title>
- <body bgcolor="#ADBAC9">
- <div id="div1" class="yellow" style="VISIBILITY:visible ;
- background-color:#FFFF00;
- position: absolute; top: 60; left: 200;
- width: 360; height: 250;
- filter: revealTrans(transition=12, 'duration=0.1)
- blendTrans(duration=0.1) ">
- <div id=title onmousedown=DIVDown("div1")
- style="background-color:#30608F;padding:2px;
- font-size:13px;text-indent:5;
- color:#FFFFFF;cursor:move">標題</div>
- <img id=close onclick=Hide(div1)
- style="position: absolute; right: 2; top: 2" border="0"
- src="close.gif" width="15" height="15">
- </div>
- <script language="JavaScript">
- var Obj="none";
- var pX
- var pY
- document.onmousemove=DIVMove;
- document.onmouseup=DIVUp;
- function DIVDown(tag){
- Obj=tag;
- pX=parseInt(document.all(Obj).style.left)-event.x;
- pY=parseInt(document.all(Obj).style.top)-event.y;
- }
- function DIVMove(){
- if(Obj!="none"){
- document.all(Obj).style.left=pX+event.x;
- document.all(Obj).style.top=pY+event.y;
- event.returnValue=false;
- }
- }
- function DIVUp(){Obj="none";}
- function Hide(divid){
- divid.filters.revealTrans.apply();
- divid.style.visibility = "hidden";
- divid.filters.revealTrans.play();
- }
- </script>
- </body>
- </html>
希望本文所述對大家的javascript程序設計有所幫助。
新聞熱點
疑難解答
圖片精選
