私は常々 Web サイトにおいてアニメーションはなくてもよい存在だと考えています。なぜならば・・・と話を続けたくはあるのですが、まあ正当な強い持論があるわけでもないので、ここで大仰に語ることは控えておきます。アニメーションを実装する立場でありながら、そのような考えをもち常に自責の念にかられながらも制作を続けています。そんな中でさまざまな実装へのアプローチを試みた雑な感想を、簡単なデモとあわせてご覧ください。 1. JavaScript で要素を動かす 古から伝えられてきた魔法。緻密な計算を駆使してあらゆるものを自在に操れ。 See the Pen Animation vanilla by Syuji Higa (@syuji-higa) on CodePen. 言わずもがな、ブラウザで動くスクリプトです。トランスパイラやらコンパイラやらは溢れてはいますが、結局はこの言語になります。前までは
![Webサイトにおけるアニメーション実装へのアプローチ 〜未だ見果てぬ夢〜 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/a6437c9dc093f5d654d8231b532c3c03727d8b32/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Fadvent-calendar-ogp-background-7940cd1c8db80a7ec40711d90f43539e.jpg%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9V2ViJUUzJTgyJUI1JUUzJTgyJUE0JUUzJTgzJTg4JUUzJTgxJUFCJUUzJTgxJThBJUUzJTgxJTkxJUUzJTgyJThCJUUzJTgyJUEyJUUzJTgzJThCJUUzJTgzJUExJUUzJTgzJUJDJUUzJTgyJUI3JUUzJTgzJUE3JUUzJTgzJUIzJUU1JUFFJTlGJUU4JUEzJTg1JUUzJTgxJUI4JUUzJTgxJUFFJUUzJTgyJUEyJUUzJTgzJTk3JUUzJTgzJUFEJUUzJTgzJUJDJUUzJTgzJTgxJTIwJUUzJTgwJTlDJUU2JTlDJUFBJUUzJTgxJUEwJUU4JUE2JThCJUU2JTlFJTlDJUUzJTgxJUE2JUUzJTgxJUFDJUU1JUE0JUEyJUUzJTgwJTlDJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMzQTNDM0MmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz1jZTU0YTg2ZDZkMTI2MWQwZWMwNzNmOTZkN2ExNTgzMA%26mark-x%3D120%26mark-y%3D96%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9OTcyJnR4dD0lNDBzeXVqaS1oaWdhJnR4dC1jb2xvcj0lMjMzQTNDM0MmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1iN2E4MGNiY2E3NTlmYzJmNmVmZGE2MTg1ZjA3MzBlOA%26blend-x%3D120%26blend-y%3D500%26blend-mode%3Dnormal%26s%3Dac641caf8c4cbefa96eecc6dbfd2cf5e)