小弟刚接触js，关于计时器的问题，现上代码，求解决。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
<!--
a:link {
color: #42413C;
text-decoration:none; /* 除非将链接设置成极为独特的外观样式，否则最好提供下划线，以便可从视觉上快速识别 */
}
a:visited {
color: #6E6C64;
text-decoration:none;
}
a:hover, a:active, a:focus { /* 此组选择器将为键盘导航者提供与鼠标使用者相同的悬停体验。 */
text-decoration: none;
}
/* ~~ 此固定宽度容器包含其它 div ~~ */
.container {
width: 960px;
background: #FFF;
margin: 0 auto; /* 侧边的自动值与宽度结合使用，可以将布局居中对齐 */
}
/* ~~ 标题未指定宽度。它将扩展到布局的完整宽度。标题包含一个图像占位符，该占位符应替换为您自己的链接徽标 ~~ */
.header {
background: #ADB96E;
}
/* ~~ 这是布局信息。 ~~ 1) 填充只会放置于 div 的顶部和/或底部。此 div 中的元素侧边会有填充。这样，您可以避免使用任何“方框模型数学”。请注意，如果向 div 自身添加任何侧边填充或边框，这些侧边填充或边框将与您定义的宽度相加，得出 *总计* 宽度。您也可以选择删除 div 中的元素的填充，并在该元素中另外放置一个没有任何宽度但具有设计所需填充的 div。*/.content {
padding: 10px 0;
}
/* ~~ 脚注 ~~ */
.footer {
padding: 10px 0;
background: #CCC49F;
}
.sideFence {
z-index:1;
opacity:0.7;
position:fixed;
}
-->
</style>
<script language="javascript" type="text/javascript">
var timer_one;
var timer_zero;
function mouseover()
 {
 timer_zero = setInterval('sidePop()',100);
 
 }
function mouseout()
  {
   timer_one = setInterval('sideHide()',100);
  
  }
  function sidePop(){
var w =  parseInt(document.getElementById("sideFence").style.width);
  if(w<250)
{
w=w+25;
var n = w+"px";
document.getElementById("sideFence").style.width=n;
}
else{
clearInterval(timer_zero);
}
}

function sideHide(){
var w =  parseInt(document.getElementById("sideFence").style.width);
if(w>=25)
{
w=w-25;
var n = w+"px";
document.getElementById("sideFence").style.width=n;
}
else{
clearInterval(timer_one);
}
}
</script></head><body>
<div class="sideFence"  id="sideFence" onmouseout="mouseout()" onmouseover="mouseover()" style="width:25px; height:auto; top:250px; right:0;  overflow:hidden;background-color: #FFFFFF; display:block;" >
  <table cellpadding="0"  cellspacing="0">
    <tr >
      <td bgcolor="#FFFFFF"><a href="javaScript:void(0)"><img  style=" opacity:0.6"src="picture/side.jpg"  ></a></td>
      <td align="center"  bgcolor="#CCCCCC"  >
      <div style="height:25px;overflow:hidden; width:250px;"><span style="font-family:Elephant">英雄帖</span></div>
        <div style="height:244px; width:100%; overflow:hidden; background-color:#FFFFFF " >
          <table>
            <tr/>
            <tr>
              <td><font color="#000000">01 <a href="#">爱丽丝伪娘团全国招募中！</a></font></td>
            </tr>
            <tr>
              <td><font color="#000000">02 <a href="#">爱丽丝伪娘团全国招募中！</a></font></td>
            </tr>
            <tr>
              <td><font color="#000000">03 <a href="#">爱丽丝伪娘团全国招募中！</a></font></td>
            </tr>
            <tr>
              <td><font color="#000000">04 <a href="#">爱丽丝伪娘团全国招募中！</a></font></td>
            </tr>
            <tr>
              <td><font color="#000000">05 <a href="#">爱丽丝伪娘团全国招募中！</a></font></td>
            </tr>
            <tr>
              <td><font color="#000000">06 <a href="#">爱丽丝伪娘团全国招募中！</a></font></td>
            </tr>
            <tr>
              <td><font color="#000000">07 <a href="#">爱丽丝伪娘团全国招募中！</a></font></td>
            </tr>
            <tr>
              <td><font color="#000000">08 <a href="#">爱丽丝伪娘团全国招募中！</a></font></td>
            </tr>
            <tr>
              <td><font color="#000000">09 <a href="#">爱丽丝伪娘团全国招募中！</a></font></td>
            </tr>
            <tr>
              <td><font color="#000000">10 <a href="#">爱丽丝伪娘团全国招募中！</a></font></td>
            </tr>
          </table>
        </div>
        <div style="height:20px; width:250px; overflow:hidden;border:hidden"><span style="font-family:Elephant; font-size:smaller">Clover BBS By HUSTRC</span></div></td>
    </tr>
  </table>
</div>
<div class="container">
  <div class="header"><a href="javaScript:void(0)"><img src="" alt="在此处插入徽标" name="Insert_logo" width="180" height="90" id="Insert_logo" style="background: #C6D580; display:block;" /></a> 
    <!-- end .header --></div>
  <div class="content" style="height:800px"> 
    
    <!-- end .content --></div>
  <div class="footer">
    <p>脚注</p>
    <!-- end .footer --></div>
  <!-- end .container --></div>
</body>
</html>

解决方案 »

  1.   

     在mouseover()这个函数里面，是不是应该先清除掉timer_one，同理在mouseout()函数里面也应该先清除掉timer_zero吧
      

  2.   


    是的,不然就同时有两个定时器，一个外弹，一个收回，这样就造成一弹一收的闪烁现象。
        function mouseover() {
            if (timer_one) { clearInterval(timer_one);  }
            timer_zero = setInterval('sidePop()', 100);
                }
        function mouseout() {
            if (timer_zero) { clearInterval(timer_zero); }
            timer_one = setInterval('sideHide()', 100);    }
      

  3.   

    我解决了已经，用jquery五分钟就完事了
      

  4.   

    果然有高手在，昨天有事没来看帖子，后来直接用jquery了