おしゃれな見出しテキストのjsアニメーション4選
WEBサイトなどで見出しを動かしているものが増えてきたので、今回は見出しやタイトルを簡単にアニメーションできるものを4つご紹介したいと思います。
① 左から右にふわっと表示
左からふわっと表示させることで、高級感やリラックスした雰囲気にできますね。
See the Pen
Untitled by loa (@hana4525)
on CodePen.
② 左から右にドミノ倒しのように表示
ドミノのように文字が左から倒れるような、少しポップな感じも面白いかも。
See the Pen
Untitled by loa (@hana4525)
on CodePen.
③ 左から右に1文字ずつ表示
一文字ずつカタカタと表示することで、ユニークでITな感じにも。
See the Pen
Untitled by loa (@hana4525)
on CodePen.
④ 左から右に滑るように表示
ヌルッと右に滑りこむような、少し目立たせたいときに最適。
See the Pen
Untitled by loa (@hana4525)
on CodePen.
⑤ まとめ
今回は簡単にできる見出しアニメーションをご紹介しました。
デザインだけでなく、動きをつけるだけでも他のWEBサイトと差別化をはかることができます。
これからいろいろなテキストアニメーションをどんどん紹介していくので、用途やイメージに合わせて取り入れてみてください。
最後までご覧いただきありがとうございました。