概要
CSSのtransitionにて
transition-timing-functionに
設定した値(linear, ease系, step）によって、
実際にどういった違いが出るのかを
同時に動かして比較してみました。
比較結果
タイトル部分にカーソルを乗せてみてください。
See the Pen transition-timing-function by ymdarudy (@ymdarudy) on CodePen.
※transition-duration (動作間隔・変化速度）は
すべて2s（2秒）で設定
補足
transitionの変化を「同時比較」してる記事を
自分で見つけることができず、執筆してみました。
詳しい使い分けや解説、他に使える値などは、
下記参考記事に譲ります。
参考にさせていただいた記事