[HTML / JAVA] Verbergen / weergeven na klikken link

[paradoXical]

Daar ik mijn vorige topic perongeluk half klaar poste nogmaals een poging Uiteraard mijn welgemeende excuses

Ik ben bezig een FAQ te maken, hiervoor heb ik een leuk script gevonden op internet waarmee ik op een link kan klikken, waarna het antwoord van de vraag in beeld verschijnt. Nogmaals klikken laat het antwoord weer verbergen. Werkt goed, behalve dat bij het openen van de faq alle vragen reeds geopend staan, terwijl deze pas moeten openen wanneer ze aangegklikt worden. Voorbeeld staat hier:

http://213.51.31.133/test2.html

Om het script aan te roepen doe je simpelweg (bijv):
onClick="toggle('layer','kind','task')"

Layer is de ID van de te verbergen/showen layer.
Kind is ofwel 'visibility' ofwel 'display', je geeft dus aan welke van de twee je aan wil passen.
Task is ofwel 'show' (= je laat hem zien), 'hide' (= verbergt hem) of '' (= als hij is verborgen, laat je hem zien en andersom).

JavaScript:

<script language="Javascript">
function toggle(layer,kind,task) {
    
    if (kind=="visibility"){
        if (task=="hide")
            vis_to = "hidden";
        else if (task=="show")
            vis_to = "visible";
        else {
            
            if (document.layers)
                vis_to = (document.layers[layer].visibility=="hide") ? "show" : "hide";
                
            else if (document.all)
                vis_to = (document.all[layer].style.visibility=="hidden") ? "visible" : "hidden";
                
            else if (document.getElementById)
                vis_to = (document.getElementById(layer).style.visibility=="hidden") ? "visible" : "hidden";
        }
    } else if (kind=="display"){
        if (task=="hide")
            dis_to = "none";
        else if (task=="show")
            dis_to = "block";
        else {
            if (document.layers)
                dis_to = (document.layers[layer].display=="none") ? "block" : "none";
                
            else if (document.all)
                dis_to = (document.all[layer].style.display=="none") ? "block" : "none";
                
            else if (document.getElementById)
                dis_to = (document.getElementById(layer).style.display=="none") ? "block" : "none";
        }
    }
    
    if (document.layers)
        (kind=="display") ? document.layers[layer].display = dis_to : document.layers[layer].visibility = vis_to;
        
    else if (document.all)
        (kind=="display") ? document.all[layer].style.display = dis_to : document.all[layer].style.visibility = vis_to;
        
    else if (document.getElementById)
        (kind=="display") ? document.getElementById(layer).style.display = dis_to : document.getElementById(layer).style.visibility = vis_to;
}
</script> 

<span onClick="toggle('vlak1','display','')"><a href="#">1. Vraag 1</a></span>
<div id="vlak1">Klikken laat deze tekst zien, of laat hem juist verdwijnen.</div>

[Salandur]

laat alle entrys renderen zodat ze niet zichtbaar zijn, overeenkomend met de kind die je in de functie gebruikt

[Juup]

Okee. Je vraag is dus:
Hoe verberg ik de antwoorden als de pagina wordt geladen?

Het antwoord is: dmv css:

Cascading Stylesheet:

div.answer
{
display:none;
}

Tip: Zet duidelijk je vraag in je topic, liefst als laatste
Tip: Zet [code=js] ipv [code] in je post.

[ Voor 25% gewijzigd door Juup op 27-02-2008 16:27 ]

[paradoXical]

Probleem waar ik mee zit is het feit dat ik moet werken vanuit een CMS. Ik paste deze code dus gewoon in een box en duw op OK. en dan verschijnt deze op de site. Ik za dus in de bovenstaande code iets moeten wijzigen (maar wat?).

[CyPh]

paradoXical schreef op woensdag 27 februari 2008 @ 16:35:
Probleem waar ik mee zit is het feit dat ik moet werken vanuit een CMS. Ik paste deze code dus gewoon in een box en duw op OK. en dan verschijnt deze op de site. Ik za dus in de bovenstaande code iets moeten wijzigen (maar wat?).

HTML:

<div id="vlak1" style="display: none;">

?

[Salandur]

of

HTML:

<div id="vlak1" class="answer">

met de code van Jaaap in je stylesheet

[ Voor 3% gewijzigd door Salandur op 27-02-2008 16:46 ]

[paradoXical]

CyPh schreef op woensdag 27 februari 2008 @ 16:42:
[...]

HTML:

<div id="vlak1" style="display: none;">

?

Natuurlijk
Het werkt perfect, heel erg bedankt. begint toch tijd voor een pauze te worden.

Alleen jammer dat de CMS waarin ik het post de links verpest (wat ik uiteraard nu pas zie). Nu werkt het alsnog niet

[ Voor 5% gewijzigd door paradoXical op 27-02-2008 16:51 ]