Träd-Meny

7 svar · 328 visningar · startad av MickeA.com 19 sep. 2004

MickeA.comMedlem sedan feb. 20034 441 inlägg

Frågan19 sep. 2004 18:49#1

Hej!

Jag är ute efter en trädmeny, där man kan ha ett gäng länkar, när man trycker på en, dyker en submeny upp.
Man ska även kunna skapa två submenyer under ett visst val.
Ungefär såhär:

Länk1
     Länk1_1
     Länk1_2
          Länk1_2_1
          Länk1_2_2
     Länk1_3
Länk2
Länk3

Har letat på massor av sidor, som har sånna här menyer, men ingen som är lätt att modifiera, eller en som inte ser ut som jag tänkt mig.
Min meny behöver inte ha ngra bilder, bara rena textlänkar.
Jag är inte så haj på JS, men jag kan tänka mig att det här inte är jättesvårt för er gurus.

Väldigt tacksam för hjälp, har kört fast rejält!

Tack!

kobranturreMedlem sedan maj 2004693 inlägg

19 sep. 2004 19:04#2

http://www.webforum.nu/showthread.php?s=&threadid=106989&forumid=24

kanske?

MickeA.comMedlem sedan feb. 20034 441 inlägg

19 sep. 2004 19:22#3

Den där tråden var bra, precis det jag letar efter.
Men hur ska jag göra om jag vill ha en submeny under en submeny?
Koden ser u såhär:

<script language="javascript1.2">
function andra(i,i1,i2,i3,i4){
if (document.getElementById(i).style.display == "block"){
document.getElementById(i).style.display="none";
}
else{
document.getElementById(i).style.display="block";
document.getElementById(i1).style.display="none";
document.getElementById(i2).style.display="none";
document.getElementById(i3).style.display="none";
}
}
</script>
</head>
<body>
<table id="1" onClick="andra('1submeny','2submeny','3submeny','4submeny');" style="cursor:pointer">
<tr>
<td>Meny1</td>
</tr>
</table>
<table id="1submeny" style="display:none">
<tr><td>submeny1</td></tr>
<tr><td>submeny1</td></tr>
<tr><td>submeny1</td></tr>
<tr><td>submeny1</td></tr>
</table>
<table id="2" style="cursor:pointer" onclick="andra('2submeny','1submeny','3submeny','4submeny')">
<tr><td>Meny2</td></tr>
</table>
<table id="2submeny" style="display:none">
<tr><td>submeny2</td></tr>
<tr><td>submeny2</td></tr>
</table>
<table id="3" style="cursor:pointer" onclick="andra('3submeny','1submeny','2submeny','4submeny');">
<tr><td>Meny3</td></tr>
</table>
<table id="3submeny" style="display:none">
<tr><td>submeny3</td></tr>
<tr><td>submeny3</td></tr>
<tr><td>submeny3</td></tr>
<tr><td>submeny3</td></tr>
</table>
<table id="4" style="cursor:pointer" onclick="andra('4submeny','1submeny','2submeny','3submeny');">
<tr><td>Meny4</td></tr>
</table>
<table id="4submeny" style="display:none">
<tr><td>submeny4</td></tr>
<tr><td>submeny4</td></tr>
<tr><td>submeny4</td></tr>
</table>

Tack!

dectgapMedlem sedan sep. 20021 655 inlägg

19 sep. 2004 21:43#4

Använd gärna följande meny som jag har gjort:
http://roslund.homeip.net/mattias/tester/jsmeny2.html

Menyn är uppbyggd av oordnade listor (<ul>) där den yttersta listan måste ha ett id som används genom JavaScriptet.
Den andra paremetern till menyInit används för att tala om ifall bara en eller flera menyer får vara öppna samtidigt.
Vilka menyer som senast var öppna sparas via session-cookies, och hämtas när sidan laddas om.

MickeA.comMedlem sedan feb. 20034 441 inlägg

20 sep. 2004 05:47#5

Det är ser jättebra ut, den där kommer jag nog använda.
Nu vill hon som jag gör sidan åt bestämt ha frames på sin sida, men jag antar att det även går att använda den här menyn där?

Tack så mkt!

MickeA.comMedlem sedan feb. 20034 441 inlägg

20 sep. 2004 06:39#6

Jag försöker modifiera din meny nu, så den ska passa mig, men får bara massa felmeddelanden om jag ta bort eller lägger till osv.

På min meny ska det bara vara två av "huvudknapparna" som har en undermeny, de andra ska "länka direkt".

Ska prova lite till, men lite hjälp vore kanon, tack.

dectgapMedlem sedan sep. 20021 655 inlägg

20 sep. 2004 07:17#7

Menyn är gjord så att <hx>-element (h1, h2, ..., h6) används som "rubrik" till undermenyer. Skriptet letar upp sådana element, och binder dem till nästföljande ul-element.

Se alltså till att använda hx-element som rubriker, och var även noga med att HTML-koden blir rätt genom att validera den.

Om du ändå har problem, visa då HTML-koden du försöker använda.

MickeA.comMedlem sedan feb. 20034 441 inlägg

20 sep. 2004 07:21#8

Aha, ok, det är därför det blir fel när jag bara tar bort alla underelement till en <hx>.
Ska prova lite mer i eftermiddag och återkommer om jag får problem.
Tack!