こんにちは、CUBEの西田です。 今回は、ホームページ制作にちょっとしたアクセントとして利用できるCSSエフェクトを紹介します。 使い方は非常に簡単！画像やボタン、ロゴやコンテンツの一部になどclassを指定するだけで色んなエフェクトを実装できます。
Hover.cssの使用方法
まずはこちらから｢hover-min.css｣をダウンロードします ≫ ダウンロード
ダウンロードした｢hover-min.css｣をheader内に記述します。 [html] [/html]
後は下記のclassを指定するだけで完了！ [html] Add to Basket //class=”hvr-(エフェクト名)” [/html]
エフェクトの種類が非常に多いので、タイプに分けてデモを間単にご紹介します。
2D Transitions
Background Transitions
Icons
Border Transitions
Shadow and Glow Transitions
Speech Bubbles
Curls
ご紹介したデモを含め100種類以上のパターンがあります。 そのままだと使用箇所が限られてきますが、カスタマイズも難しくないのでサイトに合わせて色々アレンジしてみてはいかがでしょうか！
