See demo.

Availability

(script.aculo.us V1.0 and later.)

Examples

  Effect.Grow('id_of_element');

Demo

Click for Effect.Grow demo

Notes

Works safely with most Block Elements, except tables.

Options

Effect.Grow has an optional parameter: direction. This parameter can accept the following values:

• top-left


• top-right


• bottom-left


• bottom-right


• center

Example code:

onclick="new Effect.Grow('content', {direction: 'top-left'});" 

Effet.Grow has also the optional parameter: duration. This parameter can even be combined with the direction parameter.

Example code :

onclick="new Effect.Grow('content', {direction: 'center', duration: 2.0});" 

You can define different durations for several div elements, and place them in a row in order to make them appear one after another.