Avatar billede bamsemor Nybegynder
16. oktober 2007 - 21:53 Der er 14 kommentarer og
1 løsning

Undermenu-link

Kan man lave et "undermenupunkt-link" til en menu. Hvis man fx klikker på linket "bestyrelse", så dukker der underlink op hvor der står:
formand
næstformand
kasserer
mv.
Avatar billede w13 Novice
16. oktober 2007 - 22:02 #1
Jep. Men det skal laves med java script:

<script type="text/javascript">
function ToggleShow(elm){
elm=document.getElementById(id);
elm.style.display=elm.style.display=="none"?"inline":"none";
}
</script>

<p><span style="cursor:pointer" onclick="ToggleShow('undermenu1')">Åbn undermenu1</span></p>

<p id="undermenu1" style="display:none">
<a href="link1.htm">link1</a><br>
<a href="link2.htm">link2</a><br>
</p>

<p><span style="cursor:pointer" onclick="ToggleShow('undermenu2')">Åbn undermenu2</span></p>

<p id="undermenu2" style="display:none">
<a href="link1.htm">link1</a><br>
<a href="link2.htm">link2</a><br>
</p>
Avatar billede w13 Novice
16. oktober 2007 - 22:03 #2
Hov.

<script type="text/javascript">
function ToggleShow(elm){
elm=document.getElementById(elm);
elm.style.display=elm.style.display=="none"?"inline":"none";
}
</script>

<p><span style="cursor:pointer" onclick="ToggleShow('undermenu1')">Åbn undermenu1</span></p>

<p id="undermenu1" style="display:none">
<a href="link1.htm">link1</a><br>
<a href="link2.htm">link2</a><br>
</p>

<p><span style="cursor:pointer" onclick="ToggleShow('undermenu2')">Åbn undermenu2</span></p>

<p id="undermenu2" style="display:none">
<a href="link1.htm">link1</a><br>
<a href="link2.htm">link2</a><br>
</p>
Avatar billede bamsemor Nybegynder
16. oktober 2007 - 22:32 #3
w13 helt perfekt. Hvis du kan klistre en "titlekode" på "undermenu1" så man kan se, at den indeholder link1.html og link2.html, når man holder musen hen over, forhøjer jeg til 60.
Men de 30 er naturligvis hjemme!
Avatar billede w13 Novice
16. oktober 2007 - 22:38 #4
Hvad skulle der præcis stå i title?

<p><span style="cursor:pointer" title="Link1.htm, link2.htm" onclick="ToggleShow('undermenu1')">Åbn undermenu1</span></p>

<p id="undermenu1" style="display:none">
<a href="link1.htm">link1</a><br>
<a href="link2.htm">link2</a><br>
</p>

<p><span style="cursor:pointer" title="Link1.htm, link2.htm" onclick="ToggleShow('undermenu2')">Åbn undermenu2</span></p>

<p id="undermenu2" style="display:none">
<a href="link1.htm">link1</a><br>
<a href="link2.htm">link2</a><br>
</p>
Avatar billede w13 Novice
16. oktober 2007 - 22:44 #5
Muligvis kan dette gøre det automatisk, hvis du lægger det ind i script-tag'et:
-----------------------------------------
function makeTitle(elm1,elm2){
var sTitle;
for(i=0;elm2=document.getElementById(elm2).getElementsByTagName("a");i<elm2.length;i++){
  sTitle+=elm2[0].getAttribute("href")+", ";
}
elm1.setAttribute("title",sTitle);
}
-----------------------------------------
Så skal du bare ha' en onmouseover på dine overmenuer:
-----------------------------------------
<p><span style="cursor:pointer" onclick="ToggleShow('undermenu1')" onmouseover="makeTitle(this,'undermenu1')">Åbn undermenu1</span></p>

<p id="undermenu1" style="display:none">
<a href="link1.htm">link1</a><br>
<a href="link2.htm">link2</a><br>
</p>

<p><span style="cursor:pointer" onclick="ToggleShow('undermenu2')" onmouseover="makeTitle(this,'undermenu1'>Åbn undermenu2</span></p>

<p id="undermenu2" style="display:none">
<a href="link1.htm">link1</a><br>
<a href="link2.htm">link2</a><br>
</p>
Avatar billede w13 Novice
16. oktober 2007 - 22:45 #6
Hov, 2. mouseover skulle være:
makeTitle(this,'undermenu2')
Avatar billede bamsemor Nybegynder
16. oktober 2007 - 22:50 #7
teksten med lin1 osv er principielt i orden, den kan jeg ændre hen ad vejen.
Jeg ved ikke selv præcis,hvad der skal stå endnu.
Men gider du lige rette din rettelse ind i scriptet?
Avatar billede w13 Novice
16. oktober 2007 - 22:52 #8
Det første manuelle title-eksempel:
-----------------------------------
<script type="text/javascript">
function ToggleShow(elm){
elm=document.getElementById(elm);
elm.style.display=elm.style.display=="none"?"inline":"none";
}
</script>

<p><span style="cursor:pointer" title="Link1.htm, link2.htm" onclick="ToggleShow('undermenu1')">Åbn undermenu1</span></p>

<p id="undermenu1" style="display:none">
<a href="link1.htm">link1</a><br>
<a href="link2.htm">link2</a><br>
</p>

<p><span style="cursor:pointer" title="Link1.htm, link2.htm" onclick="ToggleShow('undermenu2')">Åbn undermenu2</span></p>

<p id="undermenu2" style="display:none">
<a href="link1.htm">link1</a><br>
<a href="link2.htm">link2</a><br>
</p>
-----------------------------------
Og det andet automatiske eksempel:
-----------------------------------
<script type="text/javascript">
function ToggleShow(elm){
elm=document.getElementById(elm);
elm.style.display=elm.style.display=="none"?"inline":"none";
}
function makeTitle(elm1,elm2){
var sTitle;
for(i=0;elm2=document.getElementById(elm2).getElementsByTagName("a");i<elm2.length;i++){
  sTitle+=elm2[0].getAttribute("href")+", ";
}
elm1.setAttribute("title",sTitle);
}
</script>

<p><span style="cursor:pointer" onclick="ToggleShow('undermenu1')" onmouseover="makeTitle(this,'undermenu1')">Åbn undermenu1</span></p>

<p id="undermenu1" style="display:none">
<a href="link1.htm">link1</a><br>
<a href="link2.htm">link2</a><br>
</p>

<p><span style="cursor:pointer" onclick="ToggleShow('undermenu2')" onmouseover="makeTitle(this,'undermenu2')">Åbn undermenu2</span></p>

<p id="undermenu2" style="display:none">
<a href="link1.htm">link1</a><br>
<a href="link2.htm">link2</a><br>
</p>
Avatar billede w13 Novice
16. oktober 2007 - 22:53 #9
I det automatiske henter den selv linknavnene. Du skal bruge det manuelle, hvis du selv vil bestemme.
Avatar billede bamsemor Nybegynder
16. oktober 2007 - 23:05 #10
I det automatiske får jeg desværre en fejlmeddelelse. Men i det manuelle: Der vises godt nok link1 og link2, men jeg kan ikke aktivere dem med musen.
Jeg har nok udtrykt mig dårligt. Ligesom her på eksperten.dk dukker der undermenuer op en masse, når man vil ind på et eller andet sted. Det var sådan noget jeg havde tænkt mig. Men det kan måske ikke lade sig gøre med javascript?
Avatar billede bamsemor Nybegynder
16. oktober 2007 - 23:15 #11
Jeg er uhøflig nok til at meddele, at jeg desværre skal passe min seng.
Men foreløbig tak for hjælpen.
Avatar billede w13 Novice
16. oktober 2007 - 23:37 #12
Takker for point.

Men det virker ikke som det skal? Når du siger "link1 og link2", hvilke mener du så? Kan jeg evt. se det et sted på nettet?
Avatar billede bamsemor Nybegynder
17. oktober 2007 - 06:27 #13
Hvis du går ind på eksperten.dk (altså her) og klikker på "kategorioversigt" og herefter holder musen over "databaser", dukker der ca. 10 undermenuer op, som man så kan aktivere. Det var noget i den retning, jeg havde tænkt mig, men jeg ved ikke, om det kan laves i javascript.
Nej, du kan ikke se det nogle steder på nettet. Det er bare noget jeg forbereder...
Avatar billede w13 Novice
17. oktober 2007 - 16:06 #14
Hmmm.. Så du vil altså have det ved mouseover og ikke ved click, som det er nu, og så skal det i øvrigt placeres ud for og ikke under?
Avatar billede bamsemor Nybegynder
17. oktober 2007 - 19:23 #15
Ja tak, til det hele. Hvis det ikke er for stort et arbejde. Nu har jeg jo lukket for point-kassen...
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester