学习首页 百科 人生课堂 办公软件 英语学习 操作系统 故事会 编程资料 软件学习 设计
铭瑶网 >> 学习首页 >> 编程 >> 可移动与隐藏的图层
标题：可移动与隐藏的图层

【字体： 大中小】 时间:2008-4-11 来源:互联网 作者:study

可移动与隐藏的图层

<script language="JavaScript1.2"> <!-- Begin var dragswitch=0 var nsx var nsy var nstemp function drag_dropns(name){ temp=eval(name) temp.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP) temp.onmousedown=gons temp.onmousemove=dragns temp.onmouseup=stopns } function gons(e){ temp.captureEvents(Event.MOUSEMOVE) nsx=e.x nsy=e.y } function dragns(e){ if (dragswitch==1){ temp.moveBy(e.x-nsx,e.y-nsy) return false } } function stopns(){ temp.releaseEvents(Event.MOUSEMOVE) } //drag drop function for IE 4+//// ///////////////////////////////// var dragapproved=false function drag_dropie(){ if (dragapproved==true){ document.all.showimage.style.pixelLeft=tempx+event.clientX-iex document.all.showimage.style.pixelTop=tempy+event.clientY-iey return false } } function initializedragie(){ iex=event.clientX iey=event.clientY tempx=showimage.style.pixelLeft tempy=showimage.style.pixelTop dragapproved=true document.onmousemove=drag_dropie } if (document.all){ document.onmouseup=new Function("dragapproved=false") } ////drag drop functions end here////// function hidebox(){ if (document.all) showimage.style.visibility="hidden" else if (document.layers) document.showimage.visibility="hide" } // End --> </script> <div id="showimage" style="position:absolute;left:150;top:90; width: 400px; height: 89px"> <!-- 层位置 --> <table border="0" width="400" bgcolor="#0000FF" cellspacing="0" cellpadding="1" height="164"> <!-- 边框颜色及宽度 --> <tr> <td width="100%"> <table border="0" width="399" cellspacing="0" cellpadding="0" height="175"> <tr> <td onMousedown="initializedragie()" style="cursor:move" width="94%" height="8"> <layer width="385" onMouseover="dragswitch=1;drag_dropns(showimage)" onMouseout="dragswitch=0" height="17" left="15" top="18"> <!-- 标题开始 --> <font size="2" color="#FFFFFF">数据查询</font> <!-- 结束 --> </layer> 　　</td> <td width="6%" height="8"> <a href="#" onClick="hidebox();return false"> <img src="close_up.gif" alt="關閉" align="absmiddle" border=0 width="11" height="11"></a></td> </tr><tr> <td bgcolor="#FFFFFF" style="padding:4px" colspan="2"> <!-- 层颜色设定 --> <!-- 内容开始 --> <font size="2"> E-mail <br> Guestbook <br>              <a href="http://www.aspease.com">http://www.aspease.com</a> </font>               <!-- 内容结束 -->            </td>          </tr></table></td></tr></table> </div> 

查看/参与:讨论/评论 相关文章：Javascript