Using Animations & Utilities

In this section, I show you how to use the WinJS animation features. The consistency in color and typography that Windows apps typically have can make it difficult for the user to realize that content has been updated or replaced and it can be useful to highlight the change with a short animation. I touched on some of the basic animation features in earlier chapters, but now I return to the topic in depth. I start by showing you how to directly use the CSS features which WinJS relies on and then explain how these are packaged up by the WinJS animation convenience methods. WinJS contains some prepackaged animations for common layout update scenarios, and I show you how to use these — including how to prepare your elements for animation and how to tidy up afterwards.