Dojo: The Definitive Guide

Core fx

The content of this chapter up to this point has concentrated entirely on the animation facilities that are provided by Base. The existing functionality in Base consisting of fadeIn, fadeOut, and animateProperty covers a tremendous amount of use cases; however, there are a few additional functions provided in Core's fx module that you can get for the cost of one additional dojo.require statement. These facilities for effects include functions for sliding nodes and wiping nodes in and out, as well as chaining, combining, and toggling animations.

Sliding

Sliding nodes is just as easy as fading them. You pass a hash containing configuration parameters to the dojo.fx.slideTo function just like you would with animateProperty. Table 8-5 summarizes.

Table 8-5. Parameters for Core's slide functions

Parameter	Type	Comment
node	DOM Node	The node that will be sliding.
duration	Integer	How many milliseconds the fade should last. Default value is 350.
easing	Function	A function that adjusts the acceleration and/or deceleration of the progress across a curve. Default value is (0.5 + ((Math.sin((n + 1.5) * Math.PI))/2). Note that the easing function is only defined from a domain of 0 to 1 for the fadeIn and fadeOut.
left	Integer	Where the node's left corner should be at the end of the slide.
top	Integer	Where the node's top corner should be at the end of the slide.

Example 8-3 illustrates the sliding functions. The only portions of the page that are any different from the previous fade examples are emphasized. ...