迪恩网络 tab竖列切换

admin

这串代码 你得加在你要加的那个tab切换的文件里面
比如首页就是加在index对应位置上

1. <script type="text/javascript" src="jquery-1.8.3.min.js"></script>
   
2. <script type="text/javascript" src="jquery.SuperSlide.2.1.1.js"></script>
   
3. <link href="font-awesome.min.css" type="text/css" rel="stylesheet" />
   
4. <script type="text/javascript">
   
5. var jq=jQuery.noConflict();
   
6. </script>
   
7. <style type="text/css">
   
8. .deannewtab{ width:1200px; margin:20px auto;}
   
9. .deannewtabname{ width:100px; float:left; height:160px;}
   
10. .deannewtabc{ width:1080px; float:right;}
    
11. .deannewtabname dl{ background:#596c68; }
    
12. .deannewtabname dl dd{ display:block; cursor:pointer; height:80px; line-height:80px; text-align:center; width:100px; font-size:18px; color:#fff;}
    
13. .deannewtabname dl dd.cur{ background:#95a792;}
    
14. .deannewtabc dl{}
    
15. .deannewtabc dl dd{ display:none;}
    
16. .deannewtabc dl dd ul li{ width:33.3%; float:left; height:30px; line-height:30px; margin-bottom:10px; font-size:14px;}
    
17. .deannewtabc dl dd ul li a{ color:#333;}
    
18. .deannewtabc dl dd ul li a:hover{ color:#596c68;}
    
19. 
    
20. </style>
    
21. <div class="deannewtab">
    
22. <div class="deannewtabname">
    
23.             <dl>
    
24.                 <dd class="cur">切换名字</dd>
    
25.             <dd>切换名字2</dd>
    
26.         </dl>
    
27.     </div>
    
28.     <div class="deannewtabc">
    
29.             <dl>
    
30.                 <dd style="display:block;"><ul><!--[diy=deanourys1]--><div id="deanourys1" class="area"></div><!--[/diy]--><div class="clear"></div></ul></dd>
    
31.             <dd><ul><!--[diy=deanourys2]--><div id="deanourys2" class="area"></div><!--[/diy]--><div class="clear"></div></ul></dd>
    
32.         </dl>
    
33.     </div>
    
34. </div>
    
35. <script type="text/javascript">
    
36. jQuery(".deannewtabname dl dd").each(function(s){
    
37. jQuery(this).click(function(){
    
38. jQuery(this).addClass("cur").siblings().removeClass("cur");
    
39. jQuery(".deannewtabc dl dd").eq(s).show().siblings().hide();
    
40. })
    
41. })
    
42. </script>

复制代码

然后再用这个做文字列表代码

1. [loop]<li><a href="{url}" target="_blank" title="{title}">{title}</a></li>[/loop]

复制代码

鼠标滑过切换，有个click改成hover