CSSで手軽にカスタムイージングを使おう！どうも、イソップです。 今日はCSSアニメーションでのイージングの話です。 CSSで用意されている、ease , linear , ease-in , ease-out のイージングは、 バリエーションが少ないのが残念なところですよね。 もっとJSのような動きをつけたいこともよくあります。 cubic-bezier() で自分でイージングを定義出来ますが、仕組みがわからないと手を出せないですし、 cubic-bezier.comなどで、ベジェ曲線を作ってもいいですが、結構手間だったりします。 そこで、個人的に使っているイージングスニペットを紹介します。 このスニペットを使えば、すぐにCSSアニメーションでイージングが使えます。 かなり便利ですよ〜。 最近は凝った演出を実装する機会が多く、スマホでも比較的処理が軽いCSSアニメーションを多用しています。 Sassのイージングスニペット まずは
