大家帮我看看，这个导航菜单切换的该如何修改
HTML部分：
<div class="tab1_mulu"> <div class="tab_off" onmouseover="showTab(8, 1, 0)" id="nav1_0"><a href="/">网赢首页</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 1)" id="nav1_1"><a href="/Basic_services/">基础服务</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 2)" id="nav1_2"><a href="/Xuzhou-Wang-zhan-jian-she/">网站建设</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 3)" id="nav1_3"><a href="/xuzhou-wang-zhan-tui-guang/">网站推广</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 4)" id="nav1_4"><a href="/SEO/">SEO优化</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 5)" id="nav1_5"><a href="#">综合方案</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 6)" id="nav1_6"><a href="/wang-ying-shi-ji/">网赢快报</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 7)" id="nav1_7"><a href="/jiameng/">加盟合作</a></div> </div> <div style="clear:both"></div> <div class="small_mulu"> <div id="showTab1_0"> <ul class="showlist"> <li> 欢迎来到网赢世纪，请选择你要的服务，徐州网站建设，徐州网站推广首选网赢世纪！ </li> </ul> </div> <div id="showTab1_1" style="display:none;"> <ul class="showlist"> <li><a href="/domain/">域名注册</a></li> <li><a href="/Web_Hosting/">虚拟主机</a></li> <li><a href="/E-mail/">企业邮箱</a></li> </ul> </div> <div id="showTab1_2" style="display:none;"> <ul class="showlist list3"> <li><a href="/Xuzhou-Wang-zhan-jian-she/dao-hang-xing.asp">企业导航型网站建设方案</a></li> <li><a href="/Xuzhou-Wang-zhan-jian-she/A-fang-an.asp">A级-企业形象型网站建设方案</a></li> <li><a href="/Xuzhou-Wang-zhan-jian-she/AA-fang-an.asp">AA级-企业门户型网站建设方案</a></li> <li><a href="/Xuzhou-Wang-zhan-jian-she/AAA-fang-an.asp">AAA级-标准商务型网站建设方案</a></li> </ul> </div> <div id="showTab1_3" style="display:none;margin-left:100px;"> <ul class="showlist"> <li><a href="/xuzhou-wang-zhan-tui-guang/sogou.asp">搜狐推广</a></li> <li><a href="/xuzhou-wang-zhan-tui-guang/baidu.asp">百度推广</a></li> <li><a href="/xuzhou-wang-zhan-tui-guang/google.asp">谷歌竞价排名</a></li> <li><a href="/xuzhou-wang-zhan-tui-guang/huicong.asp">慧聪网推广</a></li> </ul> </div> <div id="showTab1_4" style="display:none;margin-left:120px;"> <ul class="showlist"> <li>提升搜索引擎自然排名,服务于国内中小型有搜索引擎优化(seo)需求的企业</li> </ul> </div> <div id="showTab1_5" style="display:none;margin-left:300px;"> <ul class="showlist"> <li>暂时没有综合方案的活动，敬请期待！</li> </ul> </div> <div id="showTab1_6" style="display:none;margin-left:350px;"> <ul class="showlist"> <li><a href="/Wang-ying-shi-ji/list.asp?classid=4">公司新闻</a></li> <li><a href="/Wang-ying-shi-ji/list.asp?classid=5">行业新闻</a></li> <li><a href="/Wang-ying-shi-ji/list.asp?classid=6">本地新闻</a></li> <li><a href="/Wang-ying-shi-ji/list.asp?classid=7">技术文章</a></li> </ul> </div> <div id="showTab1_7" style="display:none;margin-left:350px;"> <ul class="showlist"> <li>网赢世纪欢迎您的加盟！徐州优秀互联网服务提供商，网站建设专家</li> </ul> </div> </div>
function showTab(total, channelid, id){for (var i = 0; i < total; i++){var nav = document.getElementById('nav'+channelid+'_'+i);var showTab = document.getElementById('showTab'+channelid+'_'+i);if (i == id){nav.className = 'tab_on';showTab.style.display = "";}else{nav.className = 'tab_off';showTab.style.display = "none";}document.write("nav.className ");}}<!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" /><meta name="keywords" content="源码下载,网页模板,字体下载,网页制作教程,源码交易,网站交易,网站开发,网页特效,酷站,站长论坛,web development,阿里西西" /><meta name="description" content="阿里西西(alixixi.com)服务于广大Web开发爱好者的免费技术资源网站，提供最专业的网页制作教程，网站源码和模板下载，网页特效、站长资讯等建站资源；同时提供网站开发及技术支持服务。" /><title>鼠标经过导航弹出图层特效 阿里西西首发</title><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script><style type="text/css">html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; font-family: "Verdana","lucida sans",Sans-serif; font-size: 12px; }html, body { min-height: 100%; color: #FFFFFF; background-image: url(../images/body_back.jpg); background-repeat: repeat-x; background-position: top; background-color: #161f2a;}ul.side_nav {width: 200px;float: left;margin: 0;padding: 0;}ul.side_nav li {position: relative; /*--Add a relative positioning--*/float: left;margin: 0;padding: 0;display: inline;}ul.side_nav li a {width: 165px;border-top: 1px solid #3373a9;border-bottom: 1px solid #003867;padding: 10px 10px 10px 25px;display: block;color: #fff;text-decoration: none;background: #005094 url(image/sidenav_arrow.gif) no-repeat 5px 10px;position: relative;z-index: 2;}ul.side_nav li a:hover {background-color: #2d353f;}ul.side_nav li div {display: none;position: absolute;top: 2px;left: 0;width: 225px;background:#eee;}ul.side_nav li div p {margin: 7px 0;line-height: 1.3em;padding: 0 5px 10px 30px;color: #444;background: url(image/bubble_btm.gif) no-repeat right bottom;}.content_txt {width: 480px;border-left: 1px dashed #2d353f;color: #EEE;float: left;margin-left: 20px;padding: 0 0 0 20px;display: inline;}.content_txt h4 {font-size: 140%;padding-bottom: 10px;}.content_txt p {font-size: 100%;padding: 0 0 5px 0;line-height: 130%;}</style><script type="text/javascript">$(document).ready(function(){ $("ul.side_nav li").hover(function() { $(this).find("div").stop() .animate({left: "210", opacity:1}, "fast") .css("display","block") }, function() { $(this).find("div").stop() .animate({left: "0", opacity: 0}, "fast") });});</script></head><body><ul class="side_nav"> <li> <a href="http://www.alixixi.com">阿里西西首页</a> <div><p>返回阿里西西首页</p></div> </li> <li> <a href="http://www.alixixi.com">关于阿里西西</a> <div><p>阿里西西(alixixi.com)服务于广大Web开发爱好者的免费技术资源网站，提供最专业的网页制作教程，网站源码和模板下载，网页特效、站长资讯等建站资源；同时提供网站开发及技术支持服务。</p></div> </li> <li> <a href="http://www.alixixi.com">阿里西西三号导航</a> <div><p>阿里西西web开发之家！</p></div> </li> <li> <a href="http://www.alixixi.com">阿里西西四号导航</a> <div><p>阿里西西，web开发之家！</p></div> </li> <li > <a href="http://www.alixixi.com">阿里西西五号导航</a> <div><p>阿里西西，web开发之家！</p></div> </li> <li> <a href="http://www.zzjs.net">站长特效网</a> <div><p>一流网页特效广告代码</p></div> </li></ul></body></html>
[解决办法]
...再来，我把4楼的代码补全。方便测试，小改一下样式，注意注释部分的改动即可。
<!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> <title></title> <style type="text/css"> .tab_on { background-image: url(../images/ss.png); background-repeat: no-repeat; background-position: left top; /*Begin for test*/ background-color: Salmon; width : 70px; /*End for test*/ } .tab_off { background-image: url(../images/rr.png); background-repeat: no-repeat; background-position: left top; /*Begin for test*/ background-color:Teal; width: 70px; /*End for test*/ } /*Begin for test*/ div{width: 70px;} .small_mulu div{width: 800px;} /*End for test*/ </style></head><body><div class="tab1_mulu"> <!-- <div class="tab_off" onmouseover="showTab(8, 1, 0)" id="Div1"><a href="/">网赢首页</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 1)" id="Div2"><a href="/Basic_services/">基础服务</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 2)" id="Div3"><a href="/Xuzhou-Wang-zhan-jian-she/">网站建设</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 3)" id="Div4"><a href="/xuzhou-wang-zhan-tui-guang/">网站推广</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 4)" id="Div5"><a href="/SEO/">SEO优化</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 5)" id="Div6"><a href="#">综合方案</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 6)" id="Div7"><a href="/wang-ying-shi-ji/">网赢快报</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 7)" id="Div8"><a href="/jiameng/">加盟合作</a></div> --> <div class="tab_off" onmouseover="showTab(8, 1, 0)" onmouseout="init()" id="nav1_0"><a href="?mid=0">网赢首页</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 1)" onmouseout="init()" id="nav1_1"><a href="?mid=1">基础服务</a></div > <div class="tab_off" onmouseover="showTab(8, 1, 2)" onmouseout="init()" id="nav1_2"><a href="?mid=2">网站建设</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 3)" onmouseout="init()" id="nav1_3"><a href="?mid=3">网站推广</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 4)" onmouseout="init()" id="nav1_4"><a href="?mid=4">SEO优化</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 5)" onmouseout="init()" id="nav1_5"><a href="?mid=5">综合方案</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 6)" onmouseout="init()" id="nav1_6"><a href="?mid=6">网赢快报</a></div> <div class="tab_off" onmouseover="showTab(8, 1, 7)" onmouseout="init()" id="nav1_7"><a href="?mid=7">加盟合作</a></div> </div> <div style="clear:both"></div> <div class="small_mulu"> <div id="showTab1_0"> <ul class="showlist"> <li> 欢迎来到网赢世纪，请选择你要的服务，徐州网站建设，徐州网站推广首选网赢世纪！ </li> </ul> </div> <div id="showTab1_1" style="display:none;"> <ul class="showlist"> <li><a href="/domain/">域名注册</a></li> <li><a href="/Web_Hosting/">虚拟主机</a></li> <li><a href="/E-mail/">企业邮箱</a></li> </ul> </div> <div id="showTab1_2" style="display:none;"> <ul class="showlist list3"> <li><a href="/Xuzhou-Wang-zhan-jian-she/dao-hang-xing.asp">企业导航型网站建设方案</a></li> <li><a href="/Xuzhou-Wang-zhan-jian-she/A-fang-an.asp">A级-企业形象型网站建设方案</a></li> <li><a href="/Xuzhou-Wang-zhan-jian-she/AA-fang-an.asp">AA级-企业门户型网站建设方案</a></li> <li><a href="/Xuzhou-Wang-zhan-jian-she/AAA-fang-an.asp">AAA级-标准商务型网站建设方案</a></li> </ul> </div> <div id="showTab1_3" style="display:none;margin-left:100px;"> <ul class="showlist"> <li><a href="/xuzhou-wang-zhan-tui-guang/sogou.asp">搜狐推广</a></li> <li><a href="/xuzhou-wang-zhan-tui-guang/baidu.asp">百度推广</a></li> <li><a href="/xuzhou-wang-zhan-tui-guang/google.asp">谷歌竞价排名</a></li> <li><a href="/xuzhou-wang-zhan-tui-guang/huicong.asp">慧聪网推广</a></li> </ul> </div> <div id="showTab1_4" style="display:none;margin-left:120px;"> <ul class="showlist"> <li>提升搜索引擎自然排名,服务于国内中小型有搜索引擎优化(seo)需求的企业</li> </ul> </div> <div id="showTab1_5" style="display:none;margin-left:300px;"> <ul class="showlist"> <li>暂时没有综合方案的活动，敬请期待！</li> </ul> </div> <div id="showTab1_6" style="display:none;margin-left:350px;"> <ul class="showlist"> <li><a href="/Wang-ying-shi-ji/list.asp?classid=4">公司新闻</a></li> <li><a href="/Wang-ying-shi-ji/list.asp?classid=5">行业新闻</a></li> <li><a href="/Wang-ying-shi-ji/list.asp?classid=6">本地新闻</a></li> <li><a href="/Wang-ying-shi-ji/list.asp?classid=7">技术文章</a></li> </ul> </div> <div id="showTab1_7" style="display:none;margin-left:350px;"> <ul class="showlist"> <li>网赢世纪欢迎您的加盟！徐州优秀互联网服务提供商，网站建设专家</li> </ul> </div> </div> <script type="text/javascript"> //---------begin for test----------------// function Request(strName) { var strHref = window.document.location.href; var intPos = strHref.indexOf("?"); var strRight = strHref.substr(intPos + 1); var arrTmp = strRight.split("&"); for (var i = 0; i < arrTmp.length; i++) { var arrTemp = arrTmp[i].split("="); if (arrTemp[0].toUpperCase() == strName.toUpperCase()) return arrTemp[1]; } return ""; } //when go to the tab-page, default to show this Tab var menuId = Request("mid"); if (menuId) { showTab(8, 1, menuId); } //when the mouse out function init() { if (menuId) { showTab(8, 1, menuId); } else { showTab(8, 1, 0); } } //---------End for test----------------// function showTab(total, channelid, id) { for (var i = 0; i < total; i++) { var nav = document.getElementById('nav' + channelid + '_' + i); var showTab = document.getElementById('showTab' + channelid + '_' + i); if (i == id) { nav.className = 'tab_on'; showTab.style.display = ""; } else { nav.className = 'tab_off'; showTab.style.display = "none"; } //document.write("nav.className "); } } </script></body></html>