很明显,你开的定时器不能是全局的,必须根据挂载到运动的对象上,不然全局的肯定会互相影响,就像开关一样,想不受关联,那么每个灯就对应一个开关。如下参考
<html><head>
<meta http-equiv="Content-Language" content="zh-cn">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head><script language=javascript>
//导航
function mouseover(d1, d2)
{
clearTimeout(d2.t2);
var a = parseInt(d1.style.top);
var b = parseInt(d2.style.top);
var speed = 2;
if(a < 18)
{
d1.style.top = a + speed + "px";
d2.style.top = b - speed + "px";
d1.t1 = setTimeout(function(){mouseover(d1, d2);}, 10);
}
else
{
clearTimeout(d1.t1 );
}
}function moveout(d1, d2)
{
clearTimeout(d1.t1);
var a = parseInt(d1.style.top);
var b = parseInt(d2.style.top);
var speed = 2;
if(a > 3)
{
d1.style.top = a - speed + "px";
d2.style.top = b + speed + "px";
d2.t2 = setTimeout(function(){moveout(d1, d2);}, 10);
}
else
{
clearTimeout(d2.t2);
}
}
</script><body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0"><div align="center">
<table border="0" width="100%" cellspacing="0" cellpadding="0" height="52" bgcolor="#A0131A">
<tr>
<td align="center" style="cursor:hand" onMouseOver="mouseover(div11, div12)" onMouseOut="moveout(div11, div12)" onClick="location.href='/'">
<div style="position:relative;top:3px;" id="div11"><a href="/" class="linkwhite16" onFocus="this.blur()">首 页</a></div>
<div style="position:relative;top:2px;" id="div12"><a href="/" class="linkwhite12" onFocus="this.blur()">Home</a></div>
</td>
<td align="center" style="cursor:hand" onMouseOver="mouseover(div21, div22)" onMouseOut="moveout(div21, div22)" onClick="location.href='/'">
<div style="position:relative;top:3px;" id="div21"><a href="/" class="linkwhite16" onFocus="this.blur()">关于我们</a></div>
<div style="position:relative;top:2px;" id="div22"><a href="/" class="linkwhite12" onFocus="this.blur()">About us</a></div>
</td>
<td align="center" style="cursor:hand" onMouseOver="mouseover(div31, div32)" onMouseOut="moveout(div31, div32)" onClick="location.href='/'">
<div style="position:relative;top:3px;" id="div31"><a href="/" class="linkwhite16" onFocus="this.blur()">最新动态</a></div>
<div style="position:relative;top:2px;" id="div32"><a href="/" class="linkwhite12" onFocus="this.blur()">News</a></div>
</td>
<td align="center" style="cursor:hand" onMouseOver="mouseover(div51, div52)" onMouseOut="moveout(div51, div52)" onClick="location.href='/'">
<div style="position:relative;top:3px;" id="div51"><a href="/" class="linkwhite16" onFocus="this.blur()">人力资源</a></div>
<div style="position:relative;top:2px;" id="div52"><a href="/" class="linkwhite12" onFocus="this.blur()">Human resources</a></div>
</td>
</tr>
</table>
</div>
</body></html>