Anime.jsのeaseパラメーターの挙動一覧
Web開発
Anime.jsの公式ドキュメントではeaseパラメーターの各値の挙動が視覚化されていないため、挙動のイメージがつきにくいです。
そのため、Anime.js で使用する ease パラメーターの、各値の挙動を視覚化しました。
詳しいパラメーターや記述方法は、 Anime.jsの ease ドキュメント をご覧ください。
easeパラメーターの挙動一覧
linear linear(0, .5 75%, 1) irregular(10, 1) steps(10) cubicBezier(.5,0,.5,1) in in(3.35) out out(3.35) inOut inOut(3.35) inQuad outQuad inOutQuad inCubic outCubic inOutCubic inQuart outQuart inOutQuart inSine outSine inOutSine inCirc outCirc inOutCirc inExpo outExpo inOutExpo inBounce outBounce inOutBounce inBack inBack(3.40316) outBack outBack(3.40316) inOutBack inOutBack(3.40316) inElastic inElastic(2, .6) outElastic outElastic(2, .6) inOutElastic inOutElastic(2, .6)