エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
記事へのコメント1件
- 注目コメント
- 新着コメント
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
【Vue3】でアニメーション(Web Animations API)を使ってみた - Qiita
こんにちはSadoです。 今回はVue3で開閉処理を行う際に、「Web Animations API」(JavaScript)を使ってゆ... こんにちはSadoです。 今回はVue3で開閉処理を行う際に、「Web Animations API」(JavaScript)を使ってゆっくり開閉するアニメーションを作成してみます! 純粋に宣言した CSS とは違って、Web Animations APIを用いる場合 はプロパティからアニメーション時間を動的に設定することが出来るみたいです。 Web Animations APIについて やること シンプルに開閉ボタンと開いたときに表示される要素を用意して、そこにアニメーションを付け加えていきたいと思います。 準備 表示用のファイル(親)とアニメーション処理を書くファイル(子)に分けておきます。 Vue3.2の<script setup>構文を使用しております。 CSSはTailwindを使用。 <script setup lang="ts"> import Child from "./C
2022/03/20 リンク