Welcome Hello, I’m Donovan Book structure Help and support Need to brush up on your CSS? Homework Welcome “Tell me and I forget. Teach me and I remember. Involve me and I...
Star Wars Transform: Not an animation property Transform: scale(), translateZ() and rotateY() SVG, HTML and CSS Animating the Star and Wars Making it 3D The Force Awakens Hom...
Now you know CSS animation! CSS Animation cheatsheet Resources to bookmark Animate.css Hover.css Other tools GSAP Snabbt.js CSS Animate Cubic-bezier.com Next steps No...
Animations Animation in the browser Examples Transitions vs. Animations Homework Animations So far we’ve discussed why we animate, found some sources of inspiration, looked...
Transitions Transitions Transition properties In summary Homework Transitions Let’s look at the transition property. Browsers used to be much more simple. It wasn’t so lo...
Storytelling Heroes Example: Scrolling background Part 1: Background animation Part 2: Adding the hover transition Adding a message Summary Homework Storytelling Now tha...
Level up your CSS animation skills! Level up your CSS animation skills! Congratulations for finishing this introduction to CSS animation! I hope you’ve enjoyed it. Adding anima...
Transitions and JavaScript Add or remove classes Controlling transitions with JavaScript Let’s recap Homework Transitions and JavaScript So far we’ve been using the transit...
Animation recap Homework challenge: Traffic lights Recap: Animations Like a transition, only different Keyframes Putting them together Homework Animation recap We’ve cove...