Class-transition

Utilities for controlling the duration of CSS transitions.

Use the v-transition-* utilities to control the transition of an element. You can use
the feat: custom feature if you want the transition to suit your needs.

Table list transitions

Class name	Properties
v-transition--1	transition: 0.1s;
v-transition--2	transition: 0.2s;
v-transition--3	transition: 0.3s;
v-transition--4	transition: 0.4s;
v-transition--5	transition: 0.5s;
v-transition--6	transition: 0.6s;
v-transition--7	transition: 0.7s;
v-transition--8	transition: 0.8s;
v-transition--9	transition: 0.9s;
v-transition--1	transition: 0.1s;
v-transition-1	transition: 1s;
v-transition-2	transition: 2s;
v-transition-3	transition: 3s;
v-transition-4	transition: 4s;

The table above presents several types of transitions with different variants.

Example Code

index.html

<div class="v-transition-1">
</div>
<div class="v-transition-2">
</div>
<div class="v-transition-3">
</div>
<div class="v-transition-4">
</div>