Effect.BlindDown

This effect simulates a window blind, where the contents of the affected elements stay in place.

Availability

script.aculo.us V1.0 and later.

Syntax

Effect.BlindDown('id_of_element');

Options

Items in bold are default values.

· | scaleX:true, false

· | scaleY:true, false

· | scaleContent:true, false

· | scaleFromCenter:true, false

· | scaleMode:‘box’,’contents’

· | scaleFrom:100.0 (0%-100%)

· | scaleTo:0 (0%-100%)

· | duration:1 (0.0-1)

Examples

Make the transion longer by adding options.

Effect.BlindDown('id_of_element', {duration:3});

Notes

Works safely with most Block Elements, except table rows, table bodies and table heads.

Also, if you would like the block hidden when someone first lands on your page, you must use the “display: none” property within the style attribute of the div/block tag, and not in the CSS class for the div. For example:

<div style="display: none" id = "id_of_element">

Blind content

</div>

and not:

#id_of_element{

display: none;

etc...

}

This is the opposite of Effect.BlindUp