Learning CSS3 Animations and Transitions, by Alexis Goldstein

by Peter

What do you want to use: CSS? JavaScript (including jQuery)? Or both? For a while there seemed to be consensus about the roles of HTML, CSS and JavaScript among people promoting Web standards; HTML for structure (Markup), CSS for presentation (style) and JavaScripts for events (behavior). This is not the case anymore. The frontlines are rapidly changing. The culprit? None other than the W3C consortium with its emerging CSS3 standard!

CSS3 introduces a large body of new CSS that moves beyond pure style and deep into the territories previously occupied by JavaScript. Now it is possible to use CSS to do animations and transformations, to set timed transitions from one state to the next, and so on. Not long ago, this could only be done using scripting. So now the choice between JavaScript and CSS that previously concerned a very limited range – in practice it was a question about whether you preferred CSS menus to jQuery menus or CSS galleries to jQuery galleries – is now getting much, much wider. It seems theoretically possible to replace JavaScript and jQuery with CSS3 for a large number of purposes in the near future; depending, of course, on browser implementation.

CSS3 Animations GoldsteinNot surprisingly, CSS3 animations have gained considerable popularity, especially in smartphone apps. CSS3 makes it very easy to create animations and transitions and allows for dynamic effect without plugins like Flash® that often doesn’t work well and does not work at all in some settings.

Learning CSS3 Animations and Transitions, with the somewhat long subtitle «A Hands-on Guide to Animating in CSS3 with Transforms, Transitions, Keyframe Transitions, and JavaScript» is a very hands-on project-oriented introduction to the set of new techniques made available by the new CSS3 standards. It contains examples on how to use each of the new features, and the code for the examples in the book are available online. It also has a set of useful links to valuable resources. The list of chapters shows what is covered:

  • Working with CSS3 Animations
  • Building a Foundation with Transforms
  • Animating Elements with Transitions
  • Keyframe Animations
  • Creating 3D Effects with Parallax Scrolling
  • Adding Depth with 3D Transforms
  • Animating 2D and 3D Transforms
  • Using Transitions and Transforms to Animate Text
  • Building Flash-Style Animations with Keyframe Animations
  • Creating Animated Infographics
  • Building Interactive Infographics

The book is great at showing what is now possible and explaining it in an easy to understand, yet clear and concise language. I like the fact that Learning CSS3 Animations and Transitions has such a clear focus. Alexis Goldstein is a good writer; she has previously co-authored the book HTML5 & CSS3 for the Real World with Louis Lazaris and Estelle Weyl.

To my mind it is very suitable for beginner to intermediate level developers who are just starting to work on animation.

Related Posts:

Leave a Comment