页面滑动效果
这个网站http://bleacherreport.com/articles/1279323-power-ranking-every-nfl-offense-heading-into-the-2012-season上的滑动效果，在右边的“NFL Team StreamTM”中点选article，整个左边内容都会滑动切换，而且地址栏中的地址也会换成相应的地址，有知道这是怎么实现的或者有这方面资料的吗？ 谢谢！分不够再加
[解决办法]
AJAX做的
[解决办法]
应该用jquery的flip插件可以实现这种效果
[解决办法]
用IE的web developer或Firefox的firebug去debug下
[解决办法]
- HTML code
<!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>
[解决办法]
这个效果很好