only_红尘心醉 only_红尘心醉
关注数: 43 粉丝数: 44 发帖数: 3,157 关注贴吧数: 15
一个TAB滑动门切换效果的问题。求大神们帮忙看看! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://tieba.baidu.com/mo/q/checkurl?url=http%3A%2F%2Fwww.w3.org%2FTR%2Fxhtml1%2FDTD%2Fxhtml1-transitional.dtd&urlrefer=e9b2a1e0c6d358d677c4ee0138b67400"> <html xmlns="http://tieba.baidu.com/mo/q/checkurl?url=http%3A%2F%2Fwww.w3.org%2F1999%2Fxhtml&urlrefer=d0f4243b5ce5e5fa54fdafc10831c319"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>滑动门</title> <style media="screen" type="text/css"> <!-- *{font-size:12px;} html,body{margin:0;text-align:center;over-flow:hidden;height:100%;width:100%;} UL{list-style-type:none; margin:0px;} .ttl{height:18px;} .ctt{height:auto;padding:6px;clear:both;border:1px solid #064ca1;border-top:0;text-align:left;} .w936{margin:2px 0;clear:both;width:240px;/*滑动门的宽度*/} .tb_{background-image: url(''); background-repeat: repeat-x;background-color: #E6F2FF;} .tb_ ul{height:24px;} .tb_ li{float:left;height: 24px;line-height:1.9;width: 80px;cursor:pointer;} .normaltab { background-image:url(''); background-repeat: no-repeat; color:#1F3A87 ;} .hovertab { background-image: url(''); background-repeat: no-repeat; color:#1F3A87; font-weight:bold } .dis{display:block;} .undis{display:none;} --> </style> <script type="text/javascript" language="javascript"> function g(o){return document.getElementById(o);} function HoverLi(n){ for(var i=1;i<=3;i++){g('tb_'+i).className='normaltab';g('tbc_0'+i).className='undis';}g('tbc_0'+n).className='dis';g('tb_'+n).className='hovertab'; } function OutHover(n) { g('tb_'+n).className='normaltab'; } function HoverLi2(n) { for(var i=4;i<=6;i++){g('tb_'+i).className='normaltab';g('tbc_0'+i).className='undis';}g('tbc_0'+n).className='dis';g('tb_'+n).className='hovertab'; } </script> </head> <body> <div class="w936"> <div id="tb_" class="tb_"> <ul> <li id="tb_1" class="hovertab" onmouseover="HoverLi(1);" onmouseout="OutHover(1)"> 国内新闻</li> <li id="tb_2" class="normaltab" onmouseover="HoverLi(2);" onmouseout="OutHover(2)"> 国际新闻</li> <li id="tb_3" class="normaltab" onmouseover="HoverLi(3);" onmouseout="OutHover(3)"> 图说新闻</li> </ul> </div> <div class="ctt"> <div class="dis" id="tbc_01">3</div> <div class="undis" id="tbc_02">2</div> <div class="undis" id="tbc_03">1</div> </div> </div> <div class="w936"> <div id="tb_" class="tb_"> <ul> <li id="tb_4" class="hovertab" onmouseover="HoverLi2(4);" onmouseout="OutHover(4)"> 国内新闻</li> <li id="tb_5" class="normaltab" onmouseover="HoverLi2(5);" onmouseout="OutHover(5)"> 国际新闻</li> <li id="tb_6" class="normaltab" onmouseover="HoverLi2(6);" onmouseout="OutHover(6)"> 图说新闻</li> </ul> </div> <div class="ctt"> <div class="dis" id="tbc_04">1</div> <div class="undis" id="tbc_05">2</div> <div class="undis" id="tbc_06">3</div> </div> </div> </body> </html> 怎么修改JS,才能实现,在我鼠标移动到别处还继续停留在hovertab,现在是鼠标取消移动到别处之后就变成normaltab了。。求大神帮忙!
1 下一页