Effect.Appear

Make an element appear. If the element was previously set to display:none; inside the style attribute of the element, the effect will automatically show the element. This means that it must be places under the style attribute of an object, and not in the CSS in the head of the document or a linked file.

Availability

script.aculo.us V1.0 and later.

Syntax

Effect.Appear('id_of_element');

Options

· | duration: 1.0 (in seconds)

· | from: 0.0 - 1.0 (percent of opacity to start)

· | to: 0.0 - 1.0 (percent of opacity to end)

Example

Effect.Appear('id_of_element', { duration: 3.0 });

Notes

Can take an options parameter, to control the underlying Effect.Opacity effect.

Works safely with most HTML elements, except table rows, table bodies and table heads.

There is a problem with floating Elements in Safari.

If you need the div to be floated you can do it like this:

<a href="#" onclick="new Effect.Appear('apear-div');">Click to apear</a>

<div style="float: right">

<div id="apear-div" style="display: none;">

Only this div has to apear!

</div>

</div>

Microsoft Internet Explorer can only set opacity on elements that have a ‘layout’. To let an element have a layout, you must set some CSS positional properties, like ‘width’ or ‘height’. See Giving Elements Layout. (Note: fixed in 1.5_rc1.)

On Microsoft Internet Explorer, this effect may display a bold/ghosting artifact on elements that don’t have a defined background. It’s unclear if this is a feature or a bug. See bug #4806.