PHP interesse |
|
@ PieterOr
1. Zet dit in je <head> tags:
<SCRIPT language=javascript>
function show_hide(id) {
if(id.style.display == "none")
id.style.display="block";
else
id.style.display="none";
}
/* kortere manier:
function show_hide(id) {
id.style.display = (id.style.display == "none") ? "block" : "none";
}
*/
</script>
<SCRIPT language=javascript> function show_hide(id) { if(id.style.display == "none") id.style.display="block"; else id.style.display="none"; } /* kortere manier: function show_hide(id) { id.style.display = (id.style.display == "none") ? "block" : "none"; } */ </script>
Voor de menuutjes maak je dus een tabel met 2 tr's (kweeni wat et meervoud is).
Voor het knopje om een menu in te klappen gebruik je dit:
<a onclick='show_hide(naamvanhetmenu)' style='cursor:hand'>
<a onclick='show_hide(naamvanhetmenu)' style='cursor:hand'>
Dit komt dus in de bovenste tr, de kop met nog eventueel de naam of hoe je het er ook uit wilt laten zien. bij 'naamvanhetmenu' vul je dus de id in voor het menu.
Dit id gebruik je in het gedeelte, de onderste tr, dat je wilt laten inklappen/verdwijnen. Daar voor krijg je dus:
Om nog even een voorbeeldje te geven zet je de bovenste code, de javascript, in een pagina in de <head> tags en dit hieronder in je body:
<table border="1" cellpadding="0" cellspacing="0" bordercolor="#111111" width="200">
<tr>
<td width="175" style="font-family: Arial Black; font-variant: small-caps; font-size:10pt">
Menu
</td>
<td width="25" align="center"><a onclick="show_hide(menu)" style="cursor:hand"><hr color="#000000" width="75%"></a></td>
</tr>
<tr id="menu">
<td colspan="2" style="font-family: Arial Black; font-variant: small-caps; font-size:10pt">
1. <a href="linka.htm">Link a</a><br>
2. <a href="linkb.htm">Link b</a><br>
3. <a href="linkc.htm">Link c </a>
</td>
</tr>
</table>
<table border="1" cellpadding="0" cellspacing="0" bordercolor="#111111" width="200"> <tr> <td width="175" style="font-family: Arial Black; font-variant: small-caps; font-size:10pt"> Menu </td> <td width="25" align="center"><a onclick="show_hide(menu)" style="cursor:hand"><hr color="#000000" width="75%"></a></td> </tr> <tr id="menu"> <td colspan="2" style="font-family: Arial Black; font-variant: small-caps; font-size:10pt"> 1. <a href="linka.htm">Link a</a><br> 2. <a href="linkb.htm">Link b</a><br> 3. <a href="linkc.htm">Link c </a> </td> </tr> </table>
Have fun with it |