[JS]カードを重ねるアニメーションで画像を表示するスライドショー
Post on:2010年6月30日
jQueryとCSS3を使用して、カードをどんどん重ねるアニメーションで画像を表示するスライドショーを紹介します。
![デモのキャプチャ](/wp-content/uploads-2010/2010063005.png)
Beautiful Photo Stack Gallery with jQuery and CSS3
デモページ
スライドショーのデフォルトは下記のようになります。
![デモのキャプチャ](/wp-content/uploads-2010/2010063003.png)
スライドショーのデフォルト
デフォルト時の左右の矢印をクリックすることで、表示している5つのパネルを変更できます。
各パネルをクリックすると、スライドショーが始まります。
![デモのキャプチャ](/wp-content/uploads-2010/2010063004.png)
左端の画像をクリック
対応ブラウザはCSS3に対応したChrome, Safariですが、Firefox, IE7などでもそれなりにスライドショーを楽しむことができます。
また、画像をAJAXで呼び出す際にPHPを使用しています。
sponsors