Complete Vue.js 2 Web Development_ Practical guide to building end-to-end web development solutions with Vue.js 2

Transitions and Animations Chapter 13

Play (P): We create a transition for every property we have touched. In the taxi

example, we use the transform property and so, we use writetransition:

all 2s ease-out to tween the taxi smoothly.

This technique is used automatically by Vue under the cover to make transitions work

inside the tag. More on that in the Adding entering and leaving

transition for elements of a list recipe.

Animating with JavaScript instead of CSS

It's a common misconception that animating with JavaScript is slower and that animations

should be done in CSS. The reality is that if used correctly, animation in JavaScript can have

similar or superior performance. In this recipe, we will create an animation with the help of
the simple but powerful Velocity.js (http:/​/​velocityjs.​org/​) library: