当前位置: 代码迷 >> .NET新技术 >> 页面切换效果,该如何解决
  详细解决方案

页面切换效果,该如何解决

热度:82   发布时间:2016-04-25 01:51:14.0
页面切换效果
这个页站

http://www.dqus.com

Discuz论坛的页面切换效果是如何实现的?


------解决方案--------------------
HTML code
本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/ws_hgo/archive/2009/11/23/4857669.aspx<!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>jquery实现菜单切换</title>        <mce:script src="../脚本/jquery-1.3.2.min.js" mce_src="脚本/jquery-1.3.2.min.js" type="text/javascript"></mce:script>      <mce:script type="text/javascript"><!--       $(function(){       var $div=$("div.title span");       $div.bind("click",function(){         $(this).addClass("select").siblings().removeClass("select");         var $index=$div.index(this);         $(".content div").eq($index).show().siblings().hide();       })       })          // --></mce:script>      <mce:style type="text/css"><!--       .title       {           font-size:12px;           width:100px;           border:1px black;           border-style:ridge;       }       .select       {         color:Aqua;       }       .content       {           font-size:14px;           color:Maroon;           border-color:Black;           border-style:ridge;           border:1px;           width:100px;           height:100px;       }       .content a       {           width:100px;           height:100px;        }       .hide       {        display:none;         }       .selected       {           background-color:Red;       }          --></mce:style><style type="text/css" mce_bogus="1">    .title       {           font-size:12px;           width:100px;           border:1px black;           border-style:ridge;       }       .select       {         color:Aqua;       }       .content       {           font-size:14px;           color:Maroon;           border-color:Black;           border-style:ridge;           border:1px;           width:100px;           height:100px;       }       .content a       {           width:100px;           height:100px;        }       .hide       {        display:none;         }       .selected       {           background-color:Red;       }       </style>  </head>  <body>  <div>  <div class="title">  <span>体育</span>  <span>娱乐</span>  <span>Jquery</span>  </div>  <div class="content">  <div>体育信息就这这里www.163.com</div>  <div class="hide">娱乐就这娱乐星空卫视</div>  <div class="hide">blog.csdn.net/ws_hgo</div>  </div>  </div>  </body>  </html>
------解决方案--------------------
JS动态变化皮肤
var obj = document.getElementById("div1"); 
obj.className=obj.className=="active2"?"active":"active2";
http://topic.csdn.net/u/20081119/17/712f1339-bb3b-4342-8963-cb889c24732d.html
  相关解决方案