[JS/dHTML] Contractable Headers

[Rickyboy]

Hey hallo..

Ik had een scriptje gevonden, wat er ongeveer zo uitziet:

code:

var ns6=document.getElementById&&!document.all?1:0
var head="display:''"
var folder=''
function expandit(curobj)
{
    folder=ns6?curobj.nextSibling.nextSibling.style:document.all[curobj.sourceIndex+1].style
    if (folder.display=="none")
        folder.display=""
    else
        folder.display="none"
}

En je plaats het bijvoorbeeld zo:

code:

<H1 style="cursor:hand" onClick="expandit(this)">Hier Klikkuh</H1>
<span style="display:none" style=&{head};>Tekst onder Header 1</span>

Nou werkt dit wel allemaal heel leuk en aardig, maar ik wil het in een tabel gebruiken. Dus dat ik op ff rij klik, en dat er dan een rij onder uitschuift...
Het lijkt mij logisch dat de STYLE tags ook gewoon werken als ze niet onder SPAN staan. Maar waar moet ik die dan neerzetten? Moet ik misschien een <TABLE></TABLE> tussen <TD></TD> zetten??

[ Voor 14% gewijzigd door Rickyboy op 02-06-2003 20:02 ]

[Yoozer]

1) Mail de maker van dit scriptje
2) Kijk in de source van de hoofdpagina van het forum . Daar wordt precies hetzelfde gedaan.

[ Voor 17% gewijzigd door Yoozer op 02-06-2003 20:46 ]

[Rickyboy]

woooow, dat op de home-page van GoT is veeeeeeeeel uitgebreider.....dat heb ik helemaal nie nodig

btw. kheb geen info over de maker van et script...

ik heb wel dit ff geprobeerd:

code:

<tr style="cursor:hand" onClick="expandit(this)"> 
  <td>Hierow al me bende</td>
</tr>
<tr>
  <td style="'&{head}'; display:'none'">
    <table>
      <tr>
    <td>blaat</td>
      </tr>
    </table>
  </td>
</tr>

maar het resultaat werkt voor geen meter

edit:
Dit geeft trouwens hetzelfde resultaat (Dat dus niet goed is):
<tr style="'&{head}'; display:'none'">
<td>blaat</td>
</tr>

[ Voor 53% gewijzigd door Rickyboy op 02-06-2003 20:57 ]

[Verwijderd]

Het werkt voor geen meter, omdat het scriptje altijd het volgende element opzoekt:

JavaScript:

folder = 
    ns6 ? 
        curobj.nextSibling.nextSibling.style : 
        document.all[curobj.sourceIndex+1].style;

En in je tabel is het volgende HTML-element niet hetgeen je uit wil klappen.

Als ik jou was, zou ik niet this gebruiken, maar gewoon een ID, doorgeven:

HTML:

<tr style="cursor:hand" onClick="expandit('ladida')"> 
  <td>Hierow al me bende</td>
</tr>
<tr>
  <td id="ladida" style="'&{head}'; display:'none'">
    <table>
      <tr>
    <td>blaat</td>
      </tr>
    </table>
  </td>
</tr>

JavaScript:

function expandit(sObjID) {
    oObj = document.getElementById(sObjID);
    if (oObj.style.display=="none")
        oObj.style.display = "";
    else
        oObj.style.display = "none";
}

Waarom gebruik je eigenlijk een tabel? Toch niet voor de opmaak, he?