キャプションがクロスしながら切り替わるcss3+jQueryのスライドギャラリーのサンプル

スポンサーリンク

css3とjQueryを使ったギャラリーの
サンプルです。css3のtransitionを
使ってキャプションをクロスさせなが
ら、切り替えています。transitionは
IEが対応していないので参考という
感じで。

という訳でサンプルです。

css3 transition slider

css3-slider01
Chromeで見ると凄くスムーズにクロススライドしてました。css3、いろいろと使いたいんですけどやはりIEが対応しないとですね・・ライブラリでドロップシャドウや角丸は対応できますけど。。

画像の切り替わり時に-moz-transition-duration: 1.5s;という設定で画像の表示時にキャプションをスライドさせて、キャプションがクロスするようにしてるみたいです。

デモは以下より。プラグインコードはサイトのソース下部にあります。

css3 transition slide

URL :
TRB :

Comments & Trackbacks (2)

Twitter

Web制作に役立つそうなリソースを独断と好みで配信しています。

かちびと.netにリンクの無いトラックバックはお受けいていません。
コメントされる前にガイドラインをご覧下さい。

twitter facebook rss contact

Ads

Posts

Contact

Services