Avatar billede prajm Nybegynder
14. marts 2004 - 00:15 Der er 13 kommentarer og
1 løsning

Problemer med menu / Udvidelse!

Hej folkens

Jeg sidder og prøver at sovse mig en menu sammen som gerne skulle være nogen lunde anstændig , og jeg sidder så lidt fast med nuværende menu som kan ses her :

http://80.164.56.73/menu/

Det er fint nok at links o.s.v kommer nede under og sådan , men er det ikke muligt og udvide den så den laver en layer ud til højre f.eks altså"ovenpå" det hele så man ikke skal lave så meget med tables og ligende lidt ala den eksperten har , men bare lidt mere "simpelt" ?
Avatar billede roenving Novice
14. marts 2004 - 00:31 #1
Er det noget i denne henretning

(noget jeg ikke fik gjort færdigt for ½ år siden, såeh ...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>

<title>Turneringsmenu</title>

<meta name="Generator" content="Stone's WebWriter 4">
<link href="turnstyle.css" rel="stylesheet" type="text/css">
<script language="javascript" type="text/javascript" src="funktioner.js"></script>

<script language="javascript" type="text/javascript">
var men = 5;// Number of active menus

function posText(){
  for(i=1;i<=men;i++){
    punkt=document.getElementById('menupunkt'+i)
    objX=parseInt(punkt.offsetLeft)+parseInt(punkt.offsetParent.offsetLeft) +parseInt(punkt.offsetParent.offsetParent.offsetLeft) +parseInt(punkt.offsetParent.offsetParent.offsetParent.offsetLeft) +45+"px";
    objY=parseInt(punkt.offsetTop)+parseInt(punkt.offsetParent.offsetTop)+parseInt(punkt.offsetParent.offsetParent.offsetTop)+parseInt(punkt.offsetParent.offsetParent.offsetParent.offsetTop)+5+"px";
    obj=document.getElementById('menutext'+i);
    obj.style.left=objX;
    obj.style.top=objY;
  }
}

function showFrame(frm){
  par=getI(top.document,frm).parentNode;
  frms=getTs(par,"IFRAME");
  for (i=0;i<frms.length;i++){
    if (frms[i].id==frm){
      frms[i].style.display="block"
    }else{
      frms[i].style.display="none"
    }
  }
}

function showMenu(nr){
    obj=document.getElementById('menutext'+nr);
    obj.style.display="block";
}

function hideMenu(nr){
    document.getElementById('menutext'+nr).style.display='none';
}
</script>

</head>

<body bgcolor="#0099CC" style="display:block;overflow:no" onload="posText()">
<div id="menu" style="display:block;overflow:no">

    <div id="menuover" class="menuOverskrift" style="display:block">Hvad vil du</div><br><br>
  <table onmouseover="showMenu(1);" onmouseout="hideMenu(1);"><tr><td>
    <div id="menupunkt1" class="menuPunkt" style="display:block"><a href="java script:showFrame('Start');">Start/Instruktion</a><br>
    <div id="menutext1" class="menuText" style="display:none;z-index:2;position:absolute;"><a href="java script:showFrame('Start');">&nbsp;&nbsp;Start&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></div></div>
    </td></tr></table>
  <br>
    <table onmouseover="showMenu(2);" onmouseout="hideMenu(2);"><tr><td>
    <div id="menupunkt2" class="menuPunkt" style="display:block">Indtastning m.v.<br><br>
    <div id="menutext2" class="menuText" style="display:none;z-index:2;position:absolute;"><a href="java script:showFrame('Init');">&nbsp;&nbsp;Start&nbsp;ny&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a><br><a href="java script:showFrame('Players');">&nbsp;&nbsp;Spillere&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></div></div>
    </td></tr></table>

    <table onmouseover="showMenu(3);" onmouseout="hideMenu(3);"><tr><td>
    <div id="menupunkt3" class="menuPunkt" style="display:block">Menu 3    <br><br>
    <div id="menutext3" class="menuText" style="display:none;z-index:2;position:absolute;">&nbsp;&nbsp;menutext3&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>&nbsp;&nbsp;menutext3&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>&nbsp;&nbsp;menutext3&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br></div></div>
    </td></tr></table>

    <table onmouseover="showMenu(4);" onmouseout="hideMenu(4);"><tr><td>
    <div id="menupunkt4" class="menuPunkt" style="display:block">Menu 4    <br><br>
    <div id="menutext4" class="menuText" style="display:none;z-index:2;position:absolute;">&nbsp;&nbsp;menutext4&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>&nbsp;&nbsp;menutext4&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>&nbsp;&nbsp;menutext4&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br></div></div>
    </td></tr></table>

    <table onmouseover="showMenu(5);" onmouseout="hideMenu(5);"><tr><td>
    <div id="menupunkt5" class="menuPunkt" style="display:block">Menu 5    <br><br>
    <div id="menutext5" class="menuText" style="display:none;z-index:2;position:absolute;">&nbsp;&nbsp;menutext5&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>&nbsp;&nbsp;menutext5&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>&nbsp;&nbsp;menutext5&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br></div></div>
    </td></tr></table>


</div>

</body>

</html>
Avatar billede prajm Nybegynder
14. marts 2004 - 00:47 #2
orv ja .. lidt ala det.. men roder lige med det og hvis det viser sig og være hva jeg skal bruge vender jeg lige tilbaws :-)
Avatar billede prajm Nybegynder
14. marts 2004 - 00:48 #3
Jeg får nogle fejl dog
Avatar billede roenving Novice
14. marts 2004 - 00:58 #4
Ja, hvis du klikker på noget kaldes der nogle funktioner til at vise frames frem, og de er der jo ikke !-)
Avatar billede prajm Nybegynder
14. marts 2004 - 01:01 #5
Jamen det er slet ikke det jeg skal bruge.. det jeg EGENTLIG er ude efter er bare.. istedet for den åbner det pågældende sub menu i sammen tabel skal den lave lidt af en "layer" oven på
Avatar billede roenving Novice
14. marts 2004 - 01:09 #6
Ja, og jeg ville også bare vise dig den, så du kunne se en måde at gøre det på, hvor layers bliver lagt delvist henover ...

Hvis det ikke er det, du kan bruge, er den jo ikke længere !-)
Avatar billede prajm Nybegynder
14. marts 2004 - 01:22 #7
Jamen jeg er ikke ligefrem en voldsom Haj til javascript og det er derfor jeg gerne vil have det lige så stille og det der finder jeg da forståligt men lidt avanceret til det jeg lige har behov for.. kan man ikke lave det på en lidt smartere måde og simpleere med layers ?
Avatar billede roenving Novice
14. marts 2004 - 01:56 #8
Tror det er svært at finde noget simplere, hvis du vil have det til at være ved siden af eller lignende ...

Måske skulle du bare starte med en af de færdige menuer, f.eks. coolmenu, som bruges i en variant her på eksperten, eller måske Burmees ...

http://www.dhtmlcentral.com/projects/coolmenus/

http://www.burmees.nl/menu/menus.htm
http://www.webdesign101.dk/xhtml/navigation/hvmenu/index.php
Avatar billede prajm Nybegynder
14. marts 2004 - 02:55 #9
hey igen

NU er jeg kommet så langt på : http://80.164.56.73/tester.html .. men hvordan får jeg f.eks den menu der popper op til og rykke sig X antal px fra menupunktet ?
Avatar billede roenving Novice
14. marts 2004 - 03:08 #10
Det er det, der sker sidst i de lange linjer i posText(), hhv. 45 og 5 px ...

-- og så har du udkommenteret forkert ...

/*
Dette er en blok-udkommentering,
hvor flere linjer er udkommenteret

-- virker i javascript og også i css
*/

//Dette er en javascript-linje, som er udkommenteret

-- det betyder, at det kun er IE, som kan vise det, for ikke engang IE-maskinen i min webwriter vil være med !-)
Avatar billede prajm Nybegynder
14. marts 2004 - 03:10 #11
Ahh oki hehe sidder bare og roder lidt men de jeg kæmper lidt med er de linjer i posText men tror jeg er ved og have den :))
Avatar billede prajm Nybegynder
14. marts 2004 - 03:38 #12
Men det er ordnet nu men gider du smide et svar så får du points ? :)
Avatar billede roenving Novice
14. marts 2004 - 03:43 #13
Velbekomme '-)
Avatar billede roenving Novice
14. marts 2004 - 13:37 #14
-- og tak for points ;~}
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