In en uitklappen van tabel

Door Aron K op 19-08-2008 13:35

3.027 views

Ik heb een pagina met daarin 5 (verschillende) tabellen onder elkaar, echter wordt dit een beetje te veel info op 1 pagina na mate dit allemaal gevuld wordt.

Daarom wil ik graag dat elke tabel kan inklappen, zodat alleen de <th> regel blijft staan, door gewoon een een + of een - in de <th> toe te voegen.

Ik weet dat ik met display: none; moet gaan werken en een javascript functie moet aanroepen die de css class gaat veranderen, maar moet ik nu 5 functies(voor elke tabel 1) gaan schrijven, of kan dit makkelijker?

En wat moet precies deze classes krijgen? de <tr>'s?

Bij voorbaat dank aan de gene die mij hulp kan bieden.

Crispijn -

19-08-2008 13:38

dit kan makkelijker. je kan bijvoorbeeld een variabelen meenemen in je javascript functie:


function hideTable(table_id){
//en dan hier gaan kijken hoe je de tr's van de table de visibility none kunt meegeven...
}

Aron K

19-08-2008 13:40

ok, dankje ik zal het eens even proberen.

Maarten Slenter

19-08-2008 13:53

Classes hoeft niet he;)


function hideTable(table_id)
{
    document.getElementById(table_id).style.display = 'none';
}

Heel simpel:D

Aron K

19-08-2008 13:55

Maar dan is mijn hele tabel toch weg?

Jacco Engel

19-08-2008 13:57

Classes hoeft niet he;)

Iemand moet even terug naar school denk ik.

met js de class veranderen is makkelijk:

document.getElementById(element).className = "class".

Verder kun je jou probleem oplossen met :


function showhide(verzender)
{
if(verzender.className == "visible")
{
verzender.className = "invisible" ;
}
else
{
verzender.className = "visible" ;
}
}

En dan gewoon met :
showhide(this) ;

Maarten Slenter

19-08-2008 13:59

Ja goed, als je meerdere CSS dingen tegelijkertijd wilt gaan veranderen is dat handig, maar als je enkel de display wilt veranderen ga je toch niet lopen klooien met classes?

Aron K

19-08-2008 14:25

Die manier van Jacco werkt perfect, dankjullie allen hartelijk.

Reageren

Inloggen om te reageren