Tutorials

Stellen ein-/ausblenden Tutorial

Einloggen
Benutzername:
Passwort:

Passwort vergessen?
Kostenlos
Anmelden
anzeigen
Stellen ein-/ausblenden


2325 - ntmb - 27.10.2006 18:19 Uhr - Version: 1 - - verlinken als BB-Code


Hiermit kann man Stellen sichtbar machen und beim nächsten klicken wieder unsichtbar Dies ist besonders gut, wenn man zu einer Überschrift eine mehr Funktion verwendet, wo man dann auf das plus klicken kann und aufeinmal der Text dazukommt. Dieses Tutorial dient nur als Grundgerüst und kann beliebig erweitert werden.

Dies ist der Javascriptteil hiermit kann man das Bild sichtbar unsichtbar machen und zwar wird einfach eine Frage gestellt, ob der Text unsichtbar ist und wenn er es ist, dann wird er sichtbar gemacht und beim nächsten klicken trifft der Sonstfall (else) ein, und danach beginnt die Abfrage von neu.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script type="text/javascript"> 
function show(ids) { 

    if(document.getElementById("m"+ids).style.visibility == "hidden"){ 
    document.getElementById("m"+ids).style.visibility='visible'; 
    document.getElementById("a"+ids).src='minus.gif'; 
    } 
    else{  
    document.getElementById("m"+ids).style.visibility='hidden';  
    document.getElementById("a"+ids).src='plus.gif'; 
    } 


</script>


Hier kommt schließlich der Htmlteil:
1
2
3
4
<span id="m1" style="visibility:hidden;">beliebiger Inhalt</span>

<img id="a1" src="plus.gif" width="9" height="9" border="0" alt=""
onclick="javascript:show(1)">

Hierbei musst du immer bei span id m[+id] eingeben und bei img id a[+id], und bei javascript:shnow([+id]) kannst du angeben welche id es sein soll

Hier mal ein Beispiel: http://www.ntmb.org/tutorials/test.html
Hier werden mehrere Dinge aufgelistet

Naja ich hoffe ich konnte euch mit den Tutorial weiterhelfen. Smily NR:8

mfg Eugen

Mitglieder-Kommentare


#3 von MrMonk
Sry für diese Frage, aber ich bin noch nicht so lange in diesem Bereich also im Bereich der HP gestaltung, ich habe zwar schön gehört da das zb auch Klapptext genannt wird, wes aber nicht genau wie ich das mache.
#2 von Thomas2500
Interessant!
#1 von Silvax
Super gutes Turtuial und gut zu Wissen

Nur registrierte Mitglieder könnten einen Kommentar schreiben.

Melde dich doch ganz einfach an, es ist kostenlos. :-)