Avatar billede stkol76 Novice
20. marts 2010 - 09:26 Der er 1 løsning

Har desperat brug for hjælp til menu

Hej

Jeg er igang med at lave en menu med "dropdown" effekt, men er kommet til et punkt hvor jeg ikke kan få den til at gøre som jeg vil.

Menuen skal være i en tabel som er placeret midt på siden, og det specielle er at submenu skal kører mod venstre. Jeg har forsøgt at tilrette nogle standard dhtml/javascrip menuer, men er løbet ind i at position til main menu hvergang på disse ikke passe hvis man kører op eller ned i opløsning. Derfor har jeg forsøgt at lave menuen fra bunden af, ved bla. hjælp af layers, men selve menu effekten med at submenu henholdsvis vises og ikke vises, samt skifter til anden sub menu, afhængig af hvor musen kører, kan jeg ikke få til at virke.

Jeg har lavet følgenden indtil videre, men har nu seriøst brug for hjælp til at få lavet resten færdigt:


-------------------- KODE START --------------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

  <script type="text/javascript">
  <!--
  function roll_over(img_name, img_src)
  {
  document[img_name].src = img_src;
  }

  // -->
  </script>
 
 
  <script type="text/javascript">
    function show(object,val) {
    document.getElementById(object).style.visibility = val;
    }
    </script>
 
</head>
<body bgcolor="#000000">

<center>

<table cellpadding="0" cellspacing="0" style="width: 279px; height: 353px" background="img/menu_bg_large.png">
<tr>
<td style="width: 120px">
                   
                        <!-- SUB MENU 1 START - -->

                        <DIV id="subProfile" style="Z-INDEX: 10; position: relative; TOP: -60px; LEFT: 0px; ">
                       
                        <table border="1" style="width: 120px; height: 100px">
                        <tr>
                        <td>HEST</td>
                        </tr>
                        </table>
                       
                        </DIV>

                        <!-- SUB MENU 1 END - -->
                       
                       
                        <!-- SUB MENU 2 START - -->

                        <DIV id="subProduct" style="Z-INDEX: 10; position: relative; TOP: -80px; LEFT: 0px; ">
                       
                        <table border="1" style="width: 120px; height: 100px">
                        <tr>
                        <td>HEST</td>
                        </tr>
                        </table>
                       
                        </DIV>

                        <!-- SUB MENU 2 END - -->

</td>
<td style="width: 159px" valign="top">

    <table border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td style="width: 159px; height: 37px"><a href="ring1.html" target="" onmouseover="roll_over('but1', 'img/profil_menu_on.png');show('subProfile','visible')" onmouseout="roll_over('but1', 'img/profil_menu_off.png');show('subProfile','hidden')"><img src="img/profil_menu_off.png" width="159" height="37" NAME="but1" border="0"></a></td>
    </tr>
    <tr>
        <td style="width: 159px; height: 37px"><a href="ring1.html" target="" onmouseover="roll_over('but2', 'img/produkter_menu_on.png');show('subProfile','visible')" onmouseout="roll_over('but2', 'img/produkter_menu_off.png');show('subProduct','hidden')"><img src="img/produkter_menu_off.png" width="159" height="37" NAME="but2" border="0"></a></td>
    </tr>   
    <tr>
        <td style="width: 159px; height: 37px"><a href="ring1.html" target="" onmouseover="roll_over('but3', 'img/investor_menu_on.png')" onmouseout="roll_over('but3', 'img/investor_menu_off.png')"><img src="img/investor_menu_off.png" width="159" height="37" NAME="but3" border="0"></a></td>
    </tr>       
    <tr>
        <td style="width: 159px; height: 37px"><a href="ring1.html" target="" onmouseover="roll_over('but4', 'img/kontakt_menu_on.png')" onmouseout="roll_over('but4', 'img/kontakt_menu_off.png')"><img src="img/kontakt_menu_off.png" width="159" height="37" NAME="but4" border="0"></a></td>
    </tr>           
    <tr>
        <td style="width: 159px; height: 37px"><a href="ring1.html" target="" onmouseover="roll_over('but5', 'img/presse_menu_on.png')" onmouseout="roll_over('but5', 'img/presse_menu_off.png')"><img src="img/presse_menu_off.png" width="159" height="37" NAME="but5" border="0"></a></td>
    </tr>         
    <tr>
        <td style="width: 159px; height: 37px"><a href="ring1.html" target="" onmouseover="roll_over('but6', 'img/jobbank_menu_on.png')" onmouseout="roll_over('but6', 'img/jobbank_menu_off.png')"><img src="img/jobbank_menu_off.png" width="159" height="37" NAME="but6" border="0"></a></td>
    </tr>             
    </table>

</td>
</tr>
</table>


</center>

</body>
</html>

-------------------- KODE SLUT --------------------------


Jeg håber virkeligt at der er en der vil hjælpe mig med at få denne menu færdig, jeg har selv brugt snart 25 timer på den og er ved at være lidt desperat.

Mange hilsner

Stig
Avatar billede stkol76 Novice
21. marts 2010 - 22:27 #1
Hej,

Jeg har selv fået fikset hele menuen, så den virker :-)

/Stig :-)
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