页面滑动效果

这个网站http://bleacherreport.com/articles/1279323-power-ranking-every-nfl-offense-heading-into-the-2012-season上的滑动效果，在右边的“NFL Team StreamTM”中点选article，整个左边内容都会滑动切换，而且地址栏中的地址也会换成相应的地址，有知道这是怎么实现的或者有这方面资料的吗？ 谢谢！分不够再加

解决方案 »

  1.   

    应该用jquery的flip插件可以实现这种效果
      

  2.   

    用IE的web developer或Firefox的firebug去debug下
      

  3.   

    <!doctype html>
    <meta charset=utf-8>
    <html>  
     <head>  
      <title>Demo</title>  
      </head>  
     <body>  
    <style>
    .main_wrapper{width:500px;height:250px;margin:0 auto;}
    #main{width:500px;height:200px;border:1px solid red;}
    </style><script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><div class="main_wrapper">
    <div id="main"></div>
    <input id="testBtnLeft" type="button" value="<<Left" />
    <input id="testBtnRight" type="button" value="Right>>" />
    </div><script>
    /*
    *数据来源可能过ajax异步获取
    *
    */
    var id = 8;
    $("#testBtnLeft").click(function(){
    window.location.href="#?id="+(--id);
    $("#main").empty().html("LEFT::::::this is a test "+id);

    });$("#testBtnRight").click(function(){
    window.location.href="#?id="+(++id);
    $("#main").empty().html("RIGHT::::::data data data data data data "+id);
    });</script>  
    </body>  
    </html>