位置：首页>> 网络编程>> JavaScript>> 一个拖动层和Onmouse自动下拉效果

一个拖动层和Onmouse自动下拉效果

作者：marvellous　来源：蓝色理想　发布时间：2007-10-08 21:25:00　

标签：拖动,层,下拉

一个拖动层和Onmouse自动下拉效果，IE支持，不支持ff。下面所示的效果四个小块可以拖动到页面任意点，大黑块可以连同四个小块随动。

但我仿照他做了一个效果并且加了Onmouse自动下拉效果后，四个小块虽可以拖动，但只能在大黑块之内拖动。也就是说拖出大黑快就看不到四小块。这是为何？
是不是有Z-index的问题？
<script language="JavaScript">var act;function over(){var h = parseInt(mytd.height);if (h < 164){mytd.height = h + 2;clearTimeout(act);act = setTimeout('over()', 10);}}function out(){var h = parseInt(mytd.height);if (h > 30){mytd.height = h - 2;clearTimeout(act);act = setTimeout('out()', 10);}}</script><table width="316" height="30" border="0" cellpadding="0" cellspacing="0" id="mytd" onMouseOver="over()" onMouseOut="out()" style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=blue,endColorStr=skyblue);" align="center"><tr><td><marquee behavior="alternate"><Font Size=3 Face="楷体_GB2312"><Font Color="#FF00FF">他</Font><Font Color="#B900FF">也</Font><Font Color="#7200FF">许</Font><Font Color="#2B00FF">明</Font><Font Color="#0015FF">天</Font><Font Color="#004AFF">就</Font><Font Color="#0080FF">回</Font><Font Color="#00B5FF">来</Font><Font Color="#00C0C7">，</Font><Font Color="#00C080">他</Font><Font Color="#00C039">也</Font><Font Color="#0EC000">许</Font><Font Color="#55C000">再</Font><Font Color="#9BC000">也</Font><Font Color="#E2C000">不</Font><Font Color="#FFA000">回</Font><Font Color="#FF6B00">来</Font><Font Color="#FF3600">了</Font><Font Color="#FF0000">。</Font></Font></marquee></td></tr></table><br><br><SCRIPT LANGUAGE="JavaScript"></SCRIPT><body ondragstart="return false" style="margin:0px" style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=blue,endColorStr=skyblue);"><div onmousedown="drag(this)" style="left:250px;position:absolute;width:300px;height:300px;background:#000;FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=orange,endColorStr=skyblue);"> <div onmousedown="drag(this)" style="top:100px;position:absolute;width:100px;height:100px;background:#F0F;FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=blue,endColorStr=skyblue);"></div> <div onmousedown="drag(this)" style="top:150px;position:absolute;width:100px;height:100px;background:#F00;FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=deeppink,endColorStr=skyblue);"></div> <div onmousedown="drag(this)" style="left:100px;position:absolute;width:100px;height:100px;background:#0F0;FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=green,endColorStr=skyblue);"></div> <div onmousedown="drag(this)" style="left:150px;position:absolute;width:100px;height:100px;background:#00F;FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=gold,endColorStr=skyblue);"></div></div>

相关阅读：

js仿googl拖拽效果

一个拖动层和Onmouse自动下拉效果

猜你喜欢