コニファ・ロゴ

csstest:jQuery プラグインquickflip.jsを使って、パネル(フリップ)を反転して表示

QuickFlipは、HTMLマークアップの任意の部分を、カードのように反転させます。下のボックスのアンカーテキスト、またはボタンをクリックすると、反転します。QuickFlipの実装は簡単で、反転させるブロック要素にclassに"quickFlip"を指定し、アクションを起こすアンカーテキストやボタンを設置するだけです。紹介ページには「アニメーションは、新鮮でオリジナルです」と書かれていますが、cssによるデザイン次第です。

 

横方向に反転

QuickFlipは、HTMLマークアップの任意の部分を、カードのように反転させます。QuickFlipの実装は簡単で、アニメーションは、新鮮でオリジナルです。

横方向に反転

横方向に反転 2

QuickFlipによる横方向反転

QuickFlipの反転エフェクトは、横方向、縦方向を選べます。

横方向に反転して戻る

縦方向に反転

QuickFlipによる縦方向反転

QuickFlipの反転エフェクトは、横方向、縦方向を選べます。

縦方向に反転

縦方向に反転 2

縦方向に反転して戻る


 

 

 

 

戻るボタン