show

show(element) -> HTMLElement

Displays and returns element.

Examples


<div id="error-message" style="display:none;"></div>

$('error-message').show();
// -> HTMLElement (and displays div#error-message)

Notes

Element.show cannot display elements hidden via CSS stylesheets. Note that this is not a Prototype limitation but a consequence of how the CSS display property works.


<style>
  #hidden-by-css {
    display: none;
  }
</style>

[…]

<div id="hidden-by-css"></div>

$('hidden-by-css').show(); // DOES NOT WORK!
// -> HTMLElement (div#error-message is still hidden!)

Backwards compatibility change

In previous versions of Prototype, you could pass an arbitrary number of elements to Element.toggle, Element.show, and Element.hide, for consistency, this is no longer possible in version 1.5!

You can however achieve a similar result by using Enumerables:


['content', 'navigation', 'footer'].each(Element.show);
// -> ['content', 'navigation', 'footer'] 
// and displays #content, #navigation and #footer.

or even better:


$('content', 'navigation', 'footer').invoke('show');
// -> [HTMLElement, HTMLElement, HTMLElement] (#content, #navigation and #footer)
// and displays #content, #navigation and #footer.