66、可移动的页面窗口

66、可移动的页面窗口

脚本说明:

第一步:把如下代码加入<body>区域中

<style type="text/css">

body,td,a {  font-size: 9pt; color: #330000; text-decoration: none}

.aa {filter:alpha(opacity=70)}

</style>

<div style="position:absolute; left:235px; top:92px;solid;cursor:move"  onmousedown="down1(this)" class="aa" id=plane0>

<table cellpadding="0" border="0" cellspacing="1" width="200" height="100" bgcolor="#000000" >

<tr><td height="18" bgcolor="#999999" >

<div align="right">点这儿关闭>>><a href="#" onClick="clase(0)"></a></div>

</td></tr><tr>

<td bgcolor="f4f4f4">这里是你的文字!!!!!!!!!!!!!!!!!!</td>

</tr></table></div>

 

<div style="position:absolute;left:350px;top:172px;z-index:1;solid;cursor:move" id=plane1 onmousedown="down1(this)" class="aa">

<table cellpadding="0" border="0" cellspacing="1" width="200" height="100" bgcolor="#000000" >

<tr><td height="18" bgcolor="#999999" >

<div align="right">点这儿关闭>>><a href="javascript:" onClick="clase(1)"></a></div>

</td></tr><tr>

<td bgcolor="f4f4f4">这里是你的文字!!!!!!!!!!!!!!!!!!</td>

</tr></table></div>

 

<script>

var over=false,down=false,divleft,divtop,n;

function clase(x){document.all['plane'+x].style.visibility='hidden'}

function down1(m){

n=m;down=true;divleft=event.clientX-parseInt(m.style.left);divtop=event.clientY-parseInt(m.style.top)}

function move(){if(down){n.style.left=event.clientX-divleft;n.style.top=event.clientY-divtop;}}</script>

把窗口移到这儿看看吧!

 

<a href="javascript:" onClick="plane0.style.visibility='visible'">点这儿重新显示0</a>

<a href="javascript:" onClick="plane1.style.visibility='visible'">点这儿重新显示1</a>

 

 

第二步:把<body>中的内容改为:

<body bgcolor="#fef4d9"  onmousemove="move()" onmouseup="down=false">

Write a comment

Comments: 0