Video description
CSS animations are pretty simple. They allow you to animate CSS properties by letting you specify what they will do at various points in time known as keyframes. In this video course designed for developers with a good understanding of CSS, HTML, and JavaScript, you'll learn about keyframes and how you can use them to create cool animations for web based user interfaces.
- Explore a series of keyframe animation techniques that make UI's more lively, interactive, and fun
- Understand how to animate CSS property changes and create elaborate pre-defined animations
- Learn the distinctions between CSS animations and CSS transitions
- Discover how to use animation to bring attention to a task a user needs to do
- Explore animation concepts and effects like text fades, sprites, IOS icon wobbles, parallax, and more
Kirupa Chinnathambi has spent most of his life trying to teach others to love web development as much as he does. When he isn't writing on kirupa.com or talking about web development, he spends his waking hours helping make the web more awesome as a program manager with the web platform team at Microsoft. Kirupa holds a Bachelor's degree in computer science from MIT.
Table of Contents
Introduction
Welcome To The Course
00:01:28
About The Author
00:01:09
CSS Animations
Meet The CSS Animation
00:03:21
Building A CSS Animation
00:04:23
More On The Animation Syntax
00:04:08
Exercise: Simple Text Fade Effect
00:04:54
Timing Functions And CSS Animations
00:03:42
Exercise: IOS Icon Wobble Effect
00:07:53
Sprite-Based Animations
00:05:34
Animations Vs Transitions
00:03:53
Exercise: Animating Form Elements
00:04:58
Exercise: Play Animation When Element Is Scrolled Into View
00:07:46
Conclusion
Wrap Up And Thank You
00:00:53