在開發一個網站的過程中各種翻頁效果數不勝數，在這里我將介紹一下簡單的一種方法就是使用css3的旋轉即可實現這種常見的效果；
顯示效果如下：
首先是頁面的布局，不用那么復雜;
a標簽的href屬性，一般指向一個URL地址，也可以調用javascript，如href="javascript:xxx();",但是文檔中推薦這樣寫<a href="http://www.111cn.net/zhongxing/U880/ javascript:void(0)" onclick="xxx();">xx</a>,但是這種方法在復雜環境下有時會產生器奇怪的問題，盡量不要使用javescript：協議作為href屬性，這樣不僅會導致不必要的觸發window.onbeforeunload事件。在IE里面更會使gif動畫圖片停止播放。
鏈接的onclick事件被先執行，其次是herf屬性下的動作，如果不想執行href屬性下的動作執行，onclick需要返回,一般寫為：onclick="xxx();return false;".
a標簽的href屬性和onclick事件的優先級級別：
（1）順序：ie 6 : href 先觸發 onclick 后觸發 ，其他瀏覽器 先觸發onlick 后觸發 href
（2）href="javascript: xxx()" 不能傳入this作為參數 ，onclick可以，例如：<a href="javascript:alert('href event');" onclick="clickevent(this);">
（3）優先觸發的方法如果返回 false 導致后一個事件不被觸發，例如：<a href="javascript:alert('href event');" onclick="clickevent(this); return false;">
（4）<a href="#"> 會導致頁面定位到書簽位置
（5）由於 1和 4 的原因 ，在ie6 下 同時有 <a href="#" 和 onclick的時候 由於頁面先因為href重新載入了一次，導致 onclick事件被瀏覽器丟棄
總結：
（1）在不需要傳入this作為參數的方法時，推薦只使用href="JavaScript: "
（2）如果需要使用this參數，推薦使用<a href="javascript:void(0);" onclick="doSomthing(this)" >
在這里不需要傳入this 作為方法的參數，所以我使用的是：javascript：next（），而圖片進行切換的js則如下所示;
在圖片進行翻轉的時候，我們需要進行一下判斷，如果不加判斷則會使carIndex超過或者低於圖片的個數；