javascript简单实现选项卡
JS:
<script type="text/javascript"> <!-- function setTab(name,cursel,n) { for(i=1;i<=n;i++) { var menu=document.getElementById(name+i); if(menu) { var con=document.getElementById("con_"+name+"_"+i); menu.className= i==cursel?"hover":""; con.style.display= i==cursel?"block":"none"; } } } //--> </script>
HTML:
<div id="menus"> <ul id="menu_navs"> <!--{loop $_G['setting']['u'] $nav}--> <LI id="navsx{$nav['i']}" onMouseOver="setTab('navsx',{$nav['i']},15)"><A id=wanggouhuisuo href="$nav[url]" target="_blank" >$nav[name]</A></LI> <LI></LI> <!--{/loop}--> </ul> <div id="menu_cons"> <div> <ul> <li> <span style="float: left; line-height: 22px; color: rgb(244, 116, 35); margin-left: 12px;">推荐栏:</span> <!--{loop $_G['setting']['u1'] $k $nav1}--> <!--{if $nav1[val] == 1}--> <UL style="DISPLAY: block" id="con_navsx_$nav1[val]"> <!--{else}--> <UL style="DISPLAY: none" id="con_navsx_$nav1[val]"> <!--{/if}--> <!--{loop $nav1[uk] $nav2}--> <LI><A href="<!--{$nav2[url]}-->" target=_blank><SPAN><!--{$nav2[name]}--></SPAN></A> </LI> <!--{/loop}--> </UL> <!--{/loop}--> </li> </ul> </div> </div> </div>