Epics@GSI Webhome

Toggle Visibility

Sources

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

Click for change of visibility

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
Topic revision: r4 - 2007-09-14, PeterZumbruch - This page was cached on 2021-10-18 - 23:10.

This site is powered by FoswikiCopyright © by the contributing authors. All material on this collaboration platform is the property of the contributing authors.
Ideas, requests, problems regarding GSI Wiki? Send feedback | Imprint (german) | Privacy Policy (german)