This effect Flashes a color as the background of an element. It is mostly used to draw attention to a part of the page that has been updated via javascript or AJAX, when the update would not otherwise be obvious.
script.aculo.us V1.0 and later.
new Effect.Highlight('id_of_element', [options]);
new Effect.Highlight(element, [options]);
| Option | Description |
| startcolor | Sets the color of first frame of the highlight the highlight. Defaults to ”#ffff99” (light yellow) |
| endcolor | Sets the color of the last frame of the highlight. This is best set to the background color of the highlighted element. Defaults to ”#ffffff” (white) |
| restorecolor | Sets the background color of the element after the highlight has finished. Defaults to the current background-color of the highlighted element (see Note) |
If the restorecolor option is not given, Effect.Highlight tries to find out the current background color of the element, which will only work reliably across browsers if the color is given with a CSS rgb triplet, like rgb(0, 255, 0).
Be aware of the synatx: this effect strictly requires a “new” in front, otherwise you will get a javascript error.
If you specify the startcolor or endcolor using short-form notation, as in #ccf, the effect will fail silently. Use the long-form, as in #ccccff.
new Effect.Highlight('my_field', {startcolor:'#ff99ff', endcolor:'#999999'})
Remember you can pass a DOM element to the element parameter..
new Effect.Highlight(this,{duration: 0.5});