hover

実際に使用してみたものやこれから使ってみたいものをまとめました。

1. ORIGINAL HOVER EFFECTS WITH CSS3

OriginalHoverEffects

画像でのエフェクトです。商品説明などの場面で使ってみたい。 DEMOあり。個人的にはDEMO10がすきです。

2. Fancy Hover Effects with CSS3 Transitions

FancyHoverEffects

これも画像で、と思いましたがいろいろな場面で使えそうです。 DEMOあり。

3. CREATIVE LINK EFFECTS

CreativeLinkEffects1

テキストリンクのエフェクトです。この中から実際にメニューのエフェクトで使ってみました。

4. Corner Triangle Slide Overlay

Corner_Triangle_Slide_Overlay

codepenから。

5. Animated Opening Type CSS Hover Effect

Animated_Opening_Type_CSS_Hover_Effect

ホバーすると文字がピラっとめくれるエフェクト。

6. Expanding Overlay Effect

ExpandingOverlayEffect

ホバーではないのですが、クリックすると全画面で表示されます。

7. Paper-Like Unfolding Effect

pfold-paper-like-unfolding-effect

こちらもホバーではないのですが、クリックすると折りたたんだ紙を開くような動作をします。

8. Css version of macbook dribbble

Css-version-of-macbook-dribbble

ホバーさせると、macbookが開きます。すごいですねこれ!

いかがでしたでしょうか? お気に入りのものが見つかれば幸いです。

ADVERTISEMENT

Author:

follow FacebookPage

当ブログがお気に召しましたら是非いいね!をお願いします!

Follow Me

閲覧頂きありがとうございました:)

Message

トップへ戻る