Element.Shortcuts

docs

MooTools has a lot of love for DOM elements, but there were a few functions we included that aren't in MooTools. In this script we mostly cover things that are shortcuts for stuff we got tired of typing over and over.

Returns true if display != none.

$('fxTarget').isVisible(); //true

Toggles between display = block and display = none.

$('fxTarget').toggle(); //hides
$('fxTarget').toggle.delay(1000, $('fxTarget')); //shows again

Element.hide() will set an element's display to 'none'.

Element.show() will set it back to what it was before you hid it (inline, block, etc.) or, if you didn't call .hide() on it previously it defaults to 'block'. You can specify what to set the display to by passing that in (Element.show('block') or Element.show('inline'));

These are just shortcuts for Element.setStyle('display', 'block').

$('fxTarget').hide(); /*hides*/
$('fxTarget').show.delay(1000, $('fxTarget')); /*shows again*/

This basically removes one class and inserts another. Useful if you need to toggle a specific class of styles. If the one to remove is not found the one to add is still added.

$('swapExample').swapClass('red', 'blue');