|
DIV Container per Mausklick ein- und ausblenden |
|
Geschrieben von Administrator
|
|
Tuesday, 2. December 2008 |
Oftmals ist es wünschenswert, das bestimmte Bereiche innerhalb einer Webseite im verborgenen bleiben, jedenfalls so lange, bis ein User darauf klickt.
So etwas lässt sich mit JavaScript realisieren.
Wo wird überhaupt sowas benötigt? Nun zb. Eingabeformulare sind ein Einsatzgebiet, weil diese oft viel Platz benötigen und so mit anderen Content verdrängen. Aber es gibt fast keinen Punkt, wo man solche Techniken nicht gebrauchen könnte.
Als erstes benötigen wir eine Javascript Function, die als On-Off Schalter fungiert.
<script language="javascript" type="text/javascript"></script>
function OnOff()
{
if(document.getElementById('InputForm').style.display == 'block')
{
document.getElementById('InputForm').style.display = 'none';
}
else
{
document.getElementById('InputForm').style.display = 'block';
}
}
Und so könnte der Einsatz aussehen...
<a href="http://www.seo-inside.de/Webmaster-Ecke/JavaScript/DIV-Container-per-Mausklick-ein-und-ausblenden.html#" onclick="OnOff()"><img alt="" src="" />Kommentar</a> <div id="InputForm" style="display: none;">
<!-- Tabelle, Bilder, Formulare usw. --> </div>
Und hier ein praktisches Beispiel:
![]() Klick mich!
Diesen Beitrag im Forum diskutieren. (0 Beiträge) |
|
Letzte Aktualisierung ( Tuesday, 2. December 2008 )
|
