This project involved building a simple login form with a wave effect on the labels. The letters of the label go up in a wave-like fashion when a field is clicked, and return to their original positions when the cursor clicks elsewhere.
- Using JavaScript, wrap a span around each label.
- In CSS, add a transition so that the label moves up when focusing on the input.
- Also add dynamic transition delay for the letters' wave effect.
form-wave-animation.mov
View the Form Animation Project here: https://marisabrantley.github.io/form-wave-animation/
Brad Traversy's Udemy Course "50 Projects in 50 Days"
https://www.udemy.com/course/50-projects-50-days/