Effect.Methods is a mixin of various effects and helper functions for DOM elements.
These methods can be accessed through the $() function or through any Element object.



The following methods are included within Effect.Methods and can be used as a shortcut for effects, helpers, etc you might want to call on an element:

Method Name Description
morph(element, style, options) starts an Effect.Morph on the element, takes style (the styles string or hash for the effect) as the first parameter, takes an optional second parameter which is the options hash for the effect
visualEffect(element, effect, options) specify any of the supported effects and pass options
getInlineOpacity a shortcut for Element#getInlineOpacity?
forceRerendering a shortcut for Element#forceRerendering?
setContentZoom a shortcut for Element#setContentZoom?
collectTextNodes a shortcut for Element#collectTextNodes?
collectTextNodesIgnoreClass a shortcut for Element#collectTextNodesIgnoreClass?
getStyles a shortcut for Element.getStyles?

Additional to this set of helper function, also all of scriptaculous’ Combination Effects and Core Effects are available within Effect.Methods and take the an options hash as an optional parameter:

Method Name Description
fade a shortcut for Effect.Fade
appear a shortcut for Effect.Appear
grow a shortcut for Effect.Grow
shrink a shortcut for Effect.Shrink
fold a shortcut for Effect.Fold
blindUp a shortcut for Effect.BlindUp
blindDown a shortcut for Effect.BlindDown
slideUp a shortcut for Effect.SlideUp
slideDown a shortcut for Effect.SlideDown
pulsate a shortcut for Effect.Pulsate
shake a shortcut for Effect.Shake
puff a shortcut for Effect.Puff
squish a shortcut for Effect.Squish
switchOff a shortcut for Effect.SwitchOff
dropOut a shortcut for Effect.DropOut
highlight a shortcut for Effect.Highlight


$('id_of_element').visualEffect('Opacity', { from: 1.0, to: 0.7, duration: 0.5 });
$('id_of_element').morph({ height: '50px', width: '200px' }, { duration: 0.5 });
$('id_of_element').fade({ delay: 0.3, duration: 0.8 });