- Overview
- Transcript
1.1 Introduction
CSS animation is everywhere these days. It’s cool to see a collection of CSS loading spinners, or experiment with a neat page slide effect, but how can we actually implement these techniques on our websites and apps? In this course I’ll guide you through the ins and outs of CSS animation as it’s used in real-world situations.
1.Introduction1 lesson, 00:42
1.1Introduction00:42
2.CSS Animation Basics6 lessons, 1:03:54
2.1Understanding CSS Animation11:43
2.2Enhancing Button Hover States12:04
2.3Drop-Down Menus with CSS Animations and JavaScript10:17
2.4Animate.css11:04
2.5Animating SVGs and Their Parts08:47
2.6Animating SVG Paths in Adobe Illustrator09:59
3.Page Scroll Animations2 lessons, 15:38
3.1Animating Based on Scroll Position With WOW.js05:59
3.2Scroll Hijacking with OnePage-Scroll.js09:39
4.Conclusion1 lesson, 00:29
4.1Conclusion00:29
1.1 Introduction
Hi and welcome to CSS animation in the real world. My name is Cory Simmons and I'll be your instructor for this course. We've all seen countless examples of beautiful CSS animation as demos on one site or another, but a dancing robot isn't always gonna be a good fit for your website. So in this course, we'll see some animations you might actually use on your website. Now, to implement them to enhance your visitor's experience. In this course, we'll go into a couple different animation techniques, see some places where animation can help your web design, and even delve into some more advance concepts like adding animations to page scroll events. It will be a fun, yet challenging course that will kick your web designs up a level. So, strap in and prepare to have your mind blown with CSS animation in the real world.