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