8. 8
    Create CSS Transition Effects in Vue.js and Nuxt
    1m 44s

Create CSS Transition Effects in Vue.js and Nuxt

InstructorJohn Lindquist

Share this video with your friends

Send Tweet

Adding a little flair to page transitions can help with the visual appeal of the app. This lesson walks you through using CSS transitions between pages to add a nice fade-in and fade-out page transition effect.

Eleonora Lester
Eleonora Lester
~ 6 years ago

The transition code from the vid didn't work for me.

This made it:

.page-enter-active,
.page-leave-active {
  transition: all 0.3s ease-out;
}
.page-enter,
.page-leave-active {
  opacity: 0;
  transform-origin: 50% 50%;
}