<p><br /> <br /> <br /> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /></p> <p><br /> <title></title> <br /> <style type="text/css"><br /> * {<br /> margin:0;<br /> padding:0;<br /> }<br /> body {<br /> margin:100px;<br /> font-family:Arial, Helvetica, sans-serif;<br /> font-size:12px;<br /> }<br /> .menu {<br /> width:480px;<br /> height:26px;<br /> border-left:1px solid #ccc;<br /> }<br /> .menu ul {<br /> list-style:none;<br /> }<br /> .menu li {<br /> float:left;<br /> <br /> }<br /> .menu li a {<br /> color:#000000;<br /> text-decoration:none;<br /> display:block;<br /> width:115px;<br /> height:26px;<br /> line-height:26px;<br /> text-align:center;<br /> background:url(http://www.yuyadong.com/test/163_tabs/title_bg.jpg) no-repeat;<br /> }<br /> .menu li a.tabactive {<br /> position:relative;<br /> background:url(http://www.yuyadong.com/test/163_tabs/title_bg.jpg) no-repeat 0 -39px;<br /> }<br /> #tabcontent1, #tabcontent2, #tabcontent3, #tabcontent4 {<br /> border:1px solid #ccc;<br /> border-top:none;<br /> width:447px;<br /> height:250px;<br /> padding:6px;<br /> font-size:12px;<br /> }<br /> </style> <br /> <script type="text/javascript"> <br /> <br /> var tablink_idname = new Array("tablink")<br /> var tabcontent_idname = new Array("tabcontent") <br /> var tabcount = new Array("4")<br /> var loadtabs = new Array("2") <br /> var autochangemenu = 1;<br /> var changespeed = 3;<br /> var stoponhover = 0;<br /> <br /> 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;}<br /> <br /> window.onload=function(){<br /> var menucount=loadtabs.length; var a = 0; var b = 1; do {easytabs(b, loadtabs[a]); a++; b++;}while (b<=menucount);<br /> if (autochangemenu!=0){start_autochange();}<br /> }<br /> </script><br /> <br /> </p> <p></p> <div class="menu"> <ul><br /> <li><a href="#" id="tablink1" onclick="return false;" onfocus="easytabs('1', '1');" onmouseover="easytabs('1', '1');" title="">新闻</a></li> <br /> <li><a href="#" id="tablink2" onclick="return false;" onfocus="easytabs('1', '2');" onmouseover="easytabs('1', '2');" title="">图片</a></li> <br /> <li><a href="#" id="tablink3" onclick="return false;" onfocus="easytabs('1', '3');" onmouseover="easytabs('1', '3');" title="">锐点</a></li> <br /> <li><a href="#" id="tablink4" onclick="return false;" onfocus="easytabs('1', '4');" onmouseover="easytabs('1', '4');" title="">奥运视频</a></li> <br /> <br /> </ul> </div> <p></p> <p></p> <div id="tabcontent1">新闻</div> <p></p> <p></p> <div id="tabcontent2">图片</div> <p></p> <p></p> <div id="tabcontent3">锐点</div> <p></p> <p></p> <div id="tabcontent4">奥运视频</div> <p></p> <p></p> <p> <p></p> </p>