CSS3アニメーションのSass Mixin集「Animate Mixin for Compass/SASS」

Pocket

ちょっとしたときにCSS3アニメーションを使いたいシーンって多々あると思うのですが、Compass使っていても効果を想像しながら書くのはダルイときが多々あると思います。そんなときはAnimate Mixin for Compass/SASSを使うと、もっと楽ができそうです。

使い方

こちらのサイトから_animate.sassをダウンロードして@import animateするだけです。

どんなエフェクトがあるのかはサイトに一覧があります。ボタンをクリックすると右のオブジェクトがアニメーションするので、効果を確認しやすいですね。

Animate_Mixin_for_Compass_SASS 2

CSS3アニメーションはPC向けサイトではIE対応なんぞがあってとても使いづらいですが、スマホ向けならかなり効果的に使うことができると思います。ちょっとしたアニメーションがあるとそれっぽくなるシーンが多々ありますし、効果的に使っていきたいですね。

Animate Mixin for Compass/SASS