这个tab轮换js怎样修改？

这个tab轮换js怎样修改？1、要求但鼠标移到可自动切换菜单时不能再自动切换，但鼠标离开后才能根据实际切换。2、要求可增加多个自动轮换菜单。
<!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=gb2312" />
<title>可以暂停滚动的TAB标签代码</title>
<style type="text/css">
ul {margin:0px; padding:0px; list-style:none; text-align:center;}
li {display:inline; line-height:23px; padding:0 10px;}
div{ text-align:center; border:1px solid #ccc; width:400px; height:100px; line-height:100px; margin:0 auto;}
.tabactive {font-weight:bold; background:#009;}
</style>
<script type="text/javascript">
var tablink_idname = new Array("tablink","anotherlink")          //设置tab菜单
var tabcontent_idname = new Array("tabcontent","anothercontent") //设置tab菜单对应内容
var tabcount = new Array("4","6") //设置对应菜单数目
var loadtabs = new Array("1","1") //设置开始菜单的位置
var autochangemenu = 2;            //设置那个菜单可自动轮动
var changespeed = 1;               //设置菜单轮动速度以秒为单位
var stoponhover = 0;               //设置菜单是否需要用户划过后自动改变 0=no 1=yes
function easytabs(menunr, active){
 if (menunr == autochangemenu){
  currenttab=active;
 }
 if ((menunr == autochangemenu)&&(stoponhover==1)){
  stop_autochange()
 }else if((menunr == autochangemenu)&&(stoponhover==0)){
  counter=0;
 }
 menunr = menunr-1;
 for (i=1; i <= tabcount[menunr]; i++){
  document.getElementById(tablink_idname[menunr]+i).className='tab'+i;
  document.getElementById(tabcontent_idname[menunr]+i).style.display = 'none';
 }
  document.getElementById(tablink_idname[menunr]+active).className='tab'+active+' tabactive';
  document.getElementById(tabcontent_idname[menunr]+active).style.display = 'block';
 }
 var timer;
 counter=0;
 var totaltabs=tabcount[autochangemenu-1];
 var currenttab=loadtabs[autochangemenu-1];
 function start_autochange(){
  counter=counter+1;
  timer=setTimeout("start_autochange()",1000);
  if (counter == changespeed+1){
   currenttab++;
   if (currenttab>totaltabs){
    currenttab=1;
   }
   easytabs(autochangemenu,currenttab);
   restart_autochange();
  }
 }
 function restart_autochange(){
  clearTimeout(timer);
  counter=0;
  start_autochange();
 }
 function stop_autochange(){
  clearTimeout(timer);
  counter=0;
 }
window.onload=function(){
 var menucount=loadtabs.length;
 var a = 0;
 var b = 1;
 var c = 2;
 do{
  easytabs(b, loadtabs[a]);
  a++;
  b++;
 }while(b<=menucount);
 if (autochangemenu!=0){
  start_autochange();
 }
}
</script>
</head>
<body>
<ul>
<li><a href="#" onmouseover="easytabs('1', '1');" title="" id="tablink1">Tab 1</a></li>
<li><a href="#" onmouseover="easytabs('1', '2');" title="" id="tablink2">Tab 2 </a></li>
<li><a href="#" onmouseover="easytabs('1', '3');" title="" id="tablink3">Tab 3 </a></li>
<li><a href="#" onmouseover="easytabs('1', '4');" title="" id="tablink4">Tab 4 </a>
</li>
</ul>
<div id="tabcontent1">Tabcontent 1</div>
<div id="tabcontent2">Tabcontent 2</div>
<div id="tabcontent3">Tabcontent 3</div>
<div id="tabcontent4">Tabcontent 4</div>
<hr />
<!--Start of the Tabmenu 2 -->
<ul>
<li><a href="#" onmouseover="easytabs('2', '1');" title="" id="anotherlink1">Tab 1</a></li>
<li><a href="#" onmouseover="easytabs('2', '2');" title="" id="anotherlink2">Tab 2</a></li>
<li><a href="#" onmouseover="easytabs('2', '3');" title="" id="anotherlink3">Tab 3</a></li>
<li><a href="#" onmouseover="easytabs('2', '4');" title="" id="anotherlink4">Tab 4</a></li>
<li><a href="#" onmouseover="easytabs('2', '5');" title="" id="anotherlink5">Tab 5</a></li>
<li><a href="#" onmouseover="easytabs('2', '6');" title="" id="anotherlink6">Tab 6</a></li>
</ul>
<div id="anothercontent1">Tabcontent 1</div>
<div id="anothercontent2">Tabcontent 2</div>
<div id="anothercontent3">Tabcontent 3</div>
<div id="anothercontent4">Tabcontent 4</div>
<div id="anothercontent5">Tabcontent 5</div>
<div id="anothercontent6">Tabcontent 6</div>
</body>
</html>

解决方案 »

  1.   

    第一个要求：JS部分无需更改，改下面那层DIV就可了！
    <li><a href="#" onmouseover="stop_autochange();" onmouseout="start_autochange();"  title="" id="anotherlink1">Tab 1</a></li>
    <li><a href="#" onmouseover="stop_autochange();" onmouseout="start_autochange();"  title="" id="anotherlink2">Tab 2</a></li>
    <li><a href="#" onmouseover="stop_autochange();" onmouseout="start_autochange();"  title="" id="anotherlink3">Tab 3</a></li>
    <li><a href="#" onmouseover="stop_autochange();" onmouseout="start_autochange();"  title="" id="anotherlink4">Tab 4</a></li>
    <li><a href="#" onmouseover="stop_autochange();" onmouseout="start_autochange();"  title="" id="anotherlink5">Tab 5</a></li>
    <li><a href="#" onmouseover="stop_autochange();" onmouseout="start_autochange();"  title="" id="anotherlink6">Tab 6</a></li>
    第二个要求每看懂你的意思 ！不好意思了！