アニメーションを極めるための6日目(1文字ずつスライドインするアニメーション)
こんにちは。
WEBデザイナーのシュウトウです。
少しずつサイトの実装に使えそうなアニメーションにしていきます!そんな今日は昨日のスライドインを応用した1文字ずつスライドインするアニメーションです。
1文字ずつスライドインするアニメーション
今日は少し複雑なので、一つにまとめてみました。
一文字ずつスライドインさせるときは画面外からではなく、一つ前の文字からスライドさせると、絶妙に横に流れていくアニメーションになります。
そして最初の「春」の文字はフェードインにしています。
全て文字が画面外から流れるアニメーションだと、間延びしますしね。
あまり長いアニメーションだと、ユーザー離脱率が高くなると思います。(とても面白いアニメーションなら別)
今日は1文字ずつスライドインするアニメーションでした。
ではまた明日、よろしくお願いします。
この記事が気に入ったらサポートをしてみませんか?