みなさんこんにちは！おさかなです！
今回は「Moving Letters」について、書いていこうと思います！
それでは、レッツゴー！！！！！
・テキストアニメーションのテンプレートを探している方
・HTML/CSS/JavaScriptで作る、文字アニメーションを探している方
・おしゃれなテキストアニメーションを使いたい方
「Moving Letters」って何？
「Moving Letters」とは(@tobiasahlin)さんが提供する、かっこいい「テキストアニメーション」が探せるサイトのことです。HTML/CSS/JavaScriptをコピーするだけで、簡単にアニメが実装できます！(いいね)
実際に使ってみよう！
アニメーションを探そう！
それでは早速サイトにアクセスしましょう！
ページをスクロールすると…こんな感じで様々な「文字アニメーション」が見れます！(おお！)
(どれもおしゃれだなぁ…✨)
気になるデザインを見つけたら「クリック」します。(ポチっと)
このようにアニメーションの「ソースコード」が表示されました！
コードは「HTML」「CSS」「JavaScript」の3ブロックに分かれています。(ふむふむ…。)
実装する際には、右側のコードを「コピー」しておきましょう！
(ひと休み💤)
コピーしたコードを貼り付けよう！
テキストエディタを開いて、先ほどコピーしたコードを貼り付けていきます。
こちらはHTML
ファイルを分けた方がコードがすっきりとしますが、今回は<head>の中にある「<style>タグ内」に、CSSを貼り付けました…！(よいしょ！)
続いてJavaScriptについても、body末尾の「<script>タグ内」に貼り付けます。
これで挙動をチェックすると……アニメーションが表示されるので、みなさんも是非試してみてください！(お疲れ様でした🍮)
↓実際に作成したものがこちら
Hello Goodbye
You say goodbye i say hello~♪
この曲って直訳すると、意味わからなすぎるよな。笑
これで全ての操作は完了です。(やった～！)
お疲れ様でした☕
ここまで読んでくださり、ありがとうございました！
