鼠标点击更换导航菜单背景图片

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
ul{ padding:0; margin:0; list-style-type:none;}
.menu{
width:250px;
height:36px;
background:url(1.gif) repeat-x;
}
.menu_left002 li{
  float:left;
 list-style-type:none;
 width:75px;
 height:36px;
 text-align:center;
 margin-right: 0px;
 margin-bottom: 0px;
 margin-left: 0px;
}
.menu_left002 ul .menu01{ /*默认菜单的背景*/
background-image:url(1.gif);
background-repeat:no-repeat;
font-weight:normal;
}
.menu_left002 ul .menu02{ /*当前菜单的背景*/
 background:url(2.gif) no-repeat;
 width:75px;
 height:36px;
 font-weight:bold;
}
</style><script>
function Tab_menu(t1)
{
 for(i=1;i<4;i++)
 {
  if (i==t1)
  {
  document.getElementById("menu"+t1).className="menu02";
  }
 }
}
</script>
</head><body onload="Tab_menu(1)"><!--加载时菜单A有背景-->
  <div class="menu">
  <div class="menu_left002">
  <ul>
 <li class="menu01" id="menu1" onclick="Tab_menu(1);"><a href="#">A</a></li>
 <li class="menu01" id="menu2" onclick="Tab_menu(2);"><a href="#">B</a></li>
 <li class="menu01" id="menu3" onclick="Tab_menu(3);"><a href="#">C</a></li>
  </ul>
  </div>
</div>
</body>
</html>功能:
  实现鼠标点击更换导航菜单背景图片.问题:
  当鼠标点击菜单B或点击C栏目后，B或C栏目变换到当前菜单背景,A栏目就变为默认菜单背景。请问这个JS函数应该如何写.谢. 

解决方案 »

  1.   


    function Tab_menu(t1)
    {
     for(i=1;i<4;i++)
     {
      if (i==t1)
      {
        document.getElementById("menu"+t1).className="menu02";
      }else{
        document.getElementById("menu"+i).className="menu01";
      }
     }
    }
    lz是要这个效果？
      

  2.   

    可以不用js,用css就可以啊，楼主是不是当在当前页就显示一种背景，其他的都是默认的
    你可以先设置所有的默认背景，然后在每一个当前页用css设置一下背景，我正在做的就是用这个方法的