Book Image

MooTools 1.2 Beginner's Guide

Book Image

MooTools 1.2 Beginner's Guide

Overview of this book

MooTools is a simple-to-use JavaScript library, ideal for people with basic JavaScript skills who want to elevate their web applications to a superior level. If you're a newcomer to MooTools looking to build dynamic, rich, and user-interactive web site applications this beginner's guide with its easy-to-follow step-by-step instructions is all you need to rapidly get to grips with MooTools.
Table of Contents (14 chapters)
MooTools 1.2 Beginner's Guide
Credits
About the Authors
About the Reviewer
Preface

Animating a CSS property with Fx.Tween


JavaScript animation effects have come a long way with the help of frameworks like MooTools that allow you to perform very fine-tuned, slick animations that rival the likes of Adobe Flash.

MooTools allows you to smoothly transition a CSS property from one value to another. For example, if you would like to transition the width of an element from 100px to 200px, or the color from #ffffff to #000000, you can.

The term "tween" comes from the animation industry; it is when the animator fades a frame into the picture while fading out the existing frame, giving the appearance of a smooth and seamless transition between the two frames.

Fx.Tween is a class extension of Fx that deals with animating one CSS property value into another. We'll explore just how cool Fx.Tween is with an example.