Java Aufklappmenü 2 - Erwin-Isabelle

Willkommen, Besucher
Bitte anmelden oder registrieren. Passwort vergessen?

Erwin-Isabelle

Forum

Technik

Javascript Tuts

Java Aufklappmenü 2

(1 Leser) (1) Besucher

Hier ist eine kleine Javascript Sammlung.

Seite: 1

THEMA: Java Aufklappmenü 2

Forum Tools

#554

Java Aufklappmenü 2 vor 1 Jahr, 7 Monaten Karma: 4

Aufklappmenü mit Text

Code:

<html><head></head><body><div>

    <label onclick="klappen(this)">Öffnen</label>

    <div style="display: none;">Text 1</div>

</div>

<hr>

<div>

    <label onclick="klappen(this)">Öffnen</label>

    <div style="display: none;">Text 2</div>



</div>

<hr>

<div>

    <label onclick="klappen(this)">Öffnen</label>

    <div style="display: none;">Text 3</div>

</div>

<hr>

<script type="text/javascript">

<!--

var text_oeffnen = "&Ouml;ffnen";

var text_schliessen = "Schliessen";

function klappen(s){

    var oeffner = s;

    var content = s.parentNode.childNodes[3];

    if(content.style.display == "none"){

        content.style.display = "block";

        oeffner.innerHTML = text_schliessen;

    }

    else{

        content.style.display = "none";

        oeffner.innerHTML = text_oeffnen;

    }

}

//-->

</script></body></html>

Aufklappmenü mit Bildern

Code:

<html><head></head><body><div>

    <label onclick="klappen(this)"><img src="BILDADRESSE"></label>

    <div style="display: none;">Text 3</div>

</div>

<hr>

<div>

    <label onclick="klappen(this)"><img src="BILDADRESSE"></label>

    <div style="display: none;">Text 2</div>

</div>

<hr>



<div>

    <label onclick="klappen(this)"><img src="BILDADRESSE"></label>

    <div style="display: none;">Text 3</div>

</div>

<script type="text/javascript">

<!--

var text_oeffnen = '<img src="BILDADRESSE" />';

var text_schliessen = '<img src="BILDADRESSE" />';

function klappen(s){

    var oeffner = s;

    var content = s.parentNode.childNodes[3];

    if(content.style.display == "none"){

        content.style.display = "block";

        oeffner.innerHTML = text_schliessen;

    }

    else{

        content.style.display = "none";

        oeffner.innerHTML = text_oeffnen;

    }

}

//-->

</script></body></html>