Vue.jsでAnimate.cssを活用したアニメーション実装
Animate.cssは、CSSベースのアニメーション効果を簡単に実装できる人気のライブラリです。Velocity.jsなどのJavaScriptアニメーションライブラリとは異なり、CSSクラスの付与だけで動作します。
インストールと準備
パッケージマネージャーでインストールします。
npm install animate.css
Vueコンポーネントで読み込みます。
import 'animate.css'
基本的な使用方法 ...
9月6日 20:02 投稿
CSSによる展開アニメーションの実装方法
アコーディオンUI（展開/折りたたみ）はよく見られるインタラクションの一つです。通常はdisplayプロパティをnoneと他の値で切り替えますが、アニメーションがなくてぎこちない印象を与えます。そこで、スムーズな展開・収縮アニメーションを実装したいというニーズが生まれます。
実装手法
1. max-height を利用する
まず思いつくのはheightを0とautoで切り替える方法で ...
8月20日 14:34 投稿