Toggle Visibility

Sources

• hideshow.js: JavaScript for this functionality

Description

This JavaScript-function enables you to toggle the visibility of almost any object of HTML code, having an object id defined, changing from invisible to a display style mode, vice versa.
In this example toggled by a click. It is also possible to use any Event mechanissm like onClick, onMouseOver etc.

Example

Code

%INCLUDE{"Epics.JavaScriptShowHideTogglePeterZumbruch"}%

<div onClick="toggleVisibility('source','block');"> __Click for change of visibility__ </div>
<div id="source" style="display: none; padding: 20px; background-color:red">
originally found at and extended <br />
http://www.testbox.de/fileadmin/hideshow.js
</div>

Syntax

toggleVisibility('object id','display style of visible object');
<!-- display style, e.g. 'block', 'inline', 'inline-block', 'list-item', 'run-in' and more -->

---

-- PeterZumbruch - 02 Jul 2007