最近のCODEPENから – 3/6/2015

CODEPEN からいくつか気になったものをいくつかピックアップしてみました。

No JS modal popup window

モーダルウィンドウを起動するボタンは input 要素にしてあります。これと :check 擬似クラスを組み合わせることで JS を使うことなくモーダルウィンドウを実装しています。なるほど。

Animated Twitter Follow Button

twiiter のアニメーションです。かわいかったので(‘-‘)

Skype Inspired spinner

keyframe を使ったシンプルなアニメーションです。

Heart<3

CSS3 アニメーションの勉強になります。

I LOVE YOU HONEY

さらっと使えるようになりたいです。

CSS-only Coffee App Concept

これも JS を使わずに input 要素と :focus 擬似クラスで実装しています。ここまでやるとスゴイ。