0Pricing
Sveltejs Academy · Lesson

Creating a morphing Transition

Build a transition that morphs an element from one shape or position to another.

Morphing Concept

A morphing transition transforms an element from one shape or position into another smoothly.

Read Initial State

Measure the element's starting layout using getBoundingClientRect.

All lessons in this course

  1. Writing a Custom Transition Function
  2. Transition Parameters: node duration delay
  3. Creating a morphing Transition
  4. CSS vs JS Transitions
← Back to Sveltejs Academy