ライブラリを使うにあたり、めちゃめちゃ手前でつまずいたので備忘的に記録する。
Anime.jsとは
HTMLで画像やら文字やら記号やらを動かすことに特化したライブラリ(ざっくり)。
公式サイト(https://animejs.com/)を見ると、めちゃめちゃエグイ動きをする。
問題発生:スーパー初心者、ライブラリのインストールの仕方が分からない
使いやすいと噂のライブラリを使いたいがライブラリを使うために、そもそも何をどうしたら使える状態になるのかが分からない。
公式サイトのダウンロードボタンを押してダウンロードしても、めちゃめちゃ丁寧に書かれているサイトを見ても、何をどうするのかがまじで全然わからない(絶望)。何故ならスーパー初心者だから。
解決策:スーパー初心者、jsDelivrからコードを取得する
jsDelivrからHTMLに埋め込む用のコードが取得できるという情報を入手。
一番上で「lib/anime.min.js」でCopyHTMLを実行し、コードを取得。
このコードをHTMLのコード内に記載すれば、ライブラリが使える。
実装:スーパー初心者、サンプルコードを使う
初心者はコードを読むな、コピペしろ。
公式サイト(https://animejs.com/)の一番下にある、「Documentation」「Examples」からいい感じのものを拝借する。
モーションとコードがセットになっているので、スーパー便利。
特に「Moving letters」は無限に遊べる。