jQuery 1.4 Animation Techniques Beginner's Guide

Summary

In this chapter we look at the new CSS3 transform style property in detail, covering all of the different transform functions including:

• matrix
• rotate
• scale
• scaleX
• scaleY
• skew
• skewX
• skewY
• translate
• translateX
• translateY

We learned a lot about the new CSS3 matrix property in this chapter, as well as how to make use of it with jQuery. Specifically, we learned the following:

• We first saw the different values that these functions take and the effects that they have on elements they are applied to.
• We also saw that in order to animate these styles, we can use simple native JavaScript intervals or timeouts to continuously adjust the function parameters, or apply them in a rapid sequence.
• We learned that mostly, these transform functions can only be applied ...