Text ein- und ausblenden (Java Script)

Anleitung zum Ein- und Ausblenden von Text.
(die Funktion für WordPress: Link)

Beim anklicken eines Button erscheint ein Text,
bei erneutem anklicken verschwindet der Text wieder.
Denkbar sind auch Bilder, Tabellen u.a.

hier ein Beispiel: (1. vorher / 2. nachher)

  1. einleitung-button.png
  2. einleitung-button_text.png

der html-Code zum Beispiel

Toogle Aufruf und Inhalt
<input type="button" class="button"
onclick="return toggleMe('para01')" value="Einleitung">
<div id="para01" style="display:none">
<span style="font-size: 9pt;"><font face="Arial">

Die Kriminalfälle des genialen Wissenschaftlers und Amateuerkriminologen Professor Dr. Dr. Dr. Augustus van Dusen, genannt die Denkmaschine, und seines Begleiters und Chronisten Hutchinson Hatch, Reporter beim Daily New Yorker, spielen um die Jahrhundertwende zwischen 1898 und 1906. Die Hörspielreihe von Michael Koser wurde von 1978 bis 1999 grösstenteils vom RIAS Berlin, später vom Deutschlandradio produziert…
</font></span>
</div>

Styling Button
input.button {
color: #fff; background: #C4D4D1;
font-size: .8em;
font-weight:bold;
font-family: Verdana, Arial, Helvetica, sans-serif;
border: solid 1px #666666;
}

Link zur Anleitung: Web-Toolbox – Text Expand

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.