[HTML ] div; tekst opent en sluit bij klik
Ik werk voor school aan een website, die ik in HTML moet maken. Ik heb een scriptje, waarmee je een link maakt, en als je daar op klinkt verschijnt er tekst. Als je er opnieuw op klikt verdwijnt deze weer.
Echter heb ik nog wel een probleem; het werkt alleen bij het eerste deel. Ik heb het 1x in de head staan, en 4x in de body. Dit zou lijkt mij geen probleem moeten zijn, maar echter als ik op de eerste klik om de tekst te laten zien en te sluiten lukt het, ga ik naar de 2é, 3é & 4é dan opent die de eerste weer...!
Dit zijn de script codes;
In de head;
Code (php)
1
<script type="text/javascript">function showcodes(a,codediv){ var divje = document.getElementById( codediv ); if (divje.style.display == "block") { divje.style.display = "none"; a.innerHTML='Klap uit'; } else { divje.style.display = "block"; a.innerHTML='Klap in'; }}</script>
In de body;
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<span style="cursor: pointer;" onclick="showcodes(this,'div_tekst');"><font color="FF0000">Klik hier!</font></span><div id="div_tekst" style="display: none;">
<font color="#FF9900">
Wil je even snel weten wat voor weer het is? Hier een overzichtje!<br><br>
Hier zie je wat voor weer het momenteel is, als je je muis erbij houd, zie je een
paar gegevens!
<br><br>
<IFRAME SRC="http://gratisweerdata.buienradar.nl/hetweer.php" NORESIZE
SCROLLING=NO HSPACE=0 VSPACE=0 FRAMEBORDER=0 MARGINHEIGHT=0 MARGINWIDTH=0
WIDTH=50 HEIGHT=40></IFRAME>
<br><br>
<script
src=http://m.fileindex.nl/files.js>
</script>
<br><br>
<IFRAME SRC="http://www.fileindex.nl/iframe.php?
style=&bgcolor=FFFFFF&link=0000FF" NORESIZE SCROLLING=YES HSPACE=0 VSPACE=0
FRAMEBORDER=0 MARGINHEIGHT=0 MARGINWIDTH=0 WIDTH=250 HEIGHT=100></IFRAME><font>
</div>
<font color="#FF9900">
Wil je even snel weten wat voor weer het is? Hier een overzichtje!<br><br>
Hier zie je wat voor weer het momenteel is, als je je muis erbij houd, zie je een
paar gegevens!
<br><br>
<IFRAME SRC="http://gratisweerdata.buienradar.nl/hetweer.php" NORESIZE
SCROLLING=NO HSPACE=0 VSPACE=0 FRAMEBORDER=0 MARGINHEIGHT=0 MARGINWIDTH=0
WIDTH=50 HEIGHT=40></IFRAME>
<br><br>
<script
src=http://m.fileindex.nl/files.js>
</script>
<br><br>
<IFRAME SRC="http://www.fileindex.nl/iframe.php?
style=&bgcolor=FFFFFF&link=0000FF" NORESIZE SCROLLING=YES HSPACE=0 VSPACE=0
FRAMEBORDER=0 MARGINHEIGHT=0 MARGINWIDTH=0 WIDTH=250 HEIGHT=100></IFRAME><font>
</div>
Ik hoop dat hier iemand mij kan helpen!
Ps. voorbeeld is op informaticacase.freehostia.com/ --> 'het weer'
Als ik de div naam verander zoals dit;
Code (php)
1
<span style="cursor: pointer;" onclick="showcodes(this,'div_tekst1')
Helpt dat jammer genoeg niet... Zou ik in de header dan ook 4x die code moeten zetten? Dat werkte namelijk niet.. Of moet ik in de header dan ook nog wat veranderen?
Het is me gelukt hoor! Voor de mensen die het wouden weten het was heel simpel;
Je moet de naam bij alle 2 in de body codes veranderen, dus de 'vid_tekst' veranderen in bijv. 'vid_tekst2'. Dit staat er dus 2x;
Dus in de head gewoon het zelfde;
Code (php)
1
<script type="text/javascript">function showcodes(a,codediv){ var divje = document.getElementById( codediv ); if (divje.style.display == "block") { divje.style.display = "none"; a.innerHTML='Klap uit'; } else { divje.style.display = "block"; a.innerHTML='Klap in'; }}</script>
En en de body;
Code (php)
1
2
3
4
5
6
2
3
4
5
6
<span style="cursor: pointer;" onclick="showcodes(this,'div_tekst1');"><font color="FF0000">Klik hier!</font></span><div id="div_tekst1" style="display: none;">
<font color="#FF9900">
HIER KOMT JE TEKST<font>
</div>
<font color="#FF9900">
HIER KOMT JE TEKST<font>
</div>
Als je dus een 2é wild toevoegen maak je van de 'div_tekst1' 'div_tekst2'! Of natuurlijk een andere leuke naam!
Hartelijk bedankt voor je hulp Jezpur!