Möglich ist es mit Javascript.
Das ganze hättest du im mtw forum coding gefunden.
Ich poste das nun einfach mal hier.
Expand/Collapse Script
----------------------
Getestet mit: IE 6.0 und Mozilla FireFox 0.9.2
Sprache: HTML/JavaScript
Es wird im folgenden eine JavaScript Funktion verwendet, um das dynamische
Ein- und Ausblenden des Contents zu ermöglichen.
Mit document.getElementById(contentid).style.display erhalten wir den derzeitigen
Status des Elements, entweder ist dieser '' (angezeigt) oder 'none' (nicht angezeigt)
und können Ihn manipulieren. Gleichzeitig wird das Element des Icons ermittelt, auf
das geklickt wird, und das Bild ggf. durch ein Plus oder Minus ersetzt (die Bilder im
angehängten Script habe ich einfach ohne zu fragen hinterhältig von der mymtw
page geklaut).
-------------------[schnipp]--------------------
<script language="JavaScript">
function expandcollapse(contentid, buttonid)
{
if (document.getElementById(contentid).style.display == 'none') <!-- Wenn momentan der Content ausgeblendet ist ... -->
{
document.getElementById(contentid).style.display = ''; <!-- ... den Content einblenden ... -->
document.getElementById(buttonid).src = 'minus.gif'; <!-- ... und das das Collapse Symbol anzeigen. -->
}
else if(document.getElementById(contentid).style.display == '') <!-- Wenn der Content momentan eingeblendet ist ... -->
{
document.getElementById(contentid).style.display = 'none'; <!-- den Content ausblenden ... -->
document.getElementById(buttonid).src = 'plus.gif'; <!-- ... und das Expand Symbol anzeigen. -->
}
}
</script>
-------------------[schnapp]--------------------
Im HTML-Teil müssen den entsprechenden Elementen dann Id's verpasst werden,
damit sie eindeutig identifiziert werden können. So ist es möglich, mehrere
Ausklappelemente auf einer Seite darzustellen, sie müssen lediglich alle eine
unterschiedliche Id haben:
-------------------[schnipp]--------------------
<body>
Hier steht der normale Text.
<span onMouseUp="expandcollapse('content1', 'button1')" style="cursor: hand"><img src="plus.gif" id="button1"></span><br>
<span id="content1" style="display: none">und der Kram hier wird halt eingeblendet oder nicht!
</span>
</body>
-------------------[schnapp]--------------------
