DannyDevs logopart of logo

lab001: Animation and Vue

July 18, 2022


The animations below were made using Vue's built-in Transition component and regular old CSS! The Transition component is a utility animation "wrapper" component that wraps the markup whose state we want to animate. It wires things up to allow us to start animating in CSS right away.

Fade-in/Fade-out


Experimenting with CSS animation

You can create your own custom animations using using CSS transitions as well as CSS keyframe animations.

I'll be doing some experimentation with GSAP (Greensock animation) next, which allows for more animation control, power, and DX (developer experience)! Until next time, DannyDevs out!

Home

Lab

Blog

About

Links