Free Trial

Safari Books Online is a digital library providing on-demand subscription access to thousands of learning resources.

  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

2. Hacking with Style > Hack 24. Turn Transforms into Animations with CSS3 Tran...

Hack 24. Turn Transforms into Animations with CSS3 Transitions

You can turn 2D and 3D transforms into custom animations with the simple-to-use transition attribute.

Animations have always been fascinating for web developers. The only animation mechanism available to us in the past has been JavaScript, but it has always been so laborious to constantly redraw our elements on the page—like creating those old flipbook animations my parents use to make back before there were televisions. A number of JavaScript libraries, including jQuery and YUI, have simplified the process of animating elements, but in the end it was still JavaScript moving elements. The results have always been disappointing.

Then along came this ray of light called transitions. Transitions aren’t animations per se, but they do allow us to add a property to a CSS declaration that changes another property over a specified duration, and wow, is it smooth!


  

You are currently reading a PREVIEW of this book.

                                                                                                                    

Get instant access to over $1 million worth of books and videos.

  

Start a Free Trial


  
  • Safari Books Online
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint