Avatar billede twistedup Nybegynder
14. juli 2005 - 16:07 Der er 8 kommentarer og
1 løsning

Hover i menu med undermenu

Hey eksperter!

Hvorfor virker min hovereffekt ikke i det her dokument:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script language="JavaScript">
    function showMnu(id) {
        var styleCheck = document.getElementById("mnu" + id).style.display;
        //alert(styleCheck);
       
        if (styleCheck == "inline") {
            document.getElementById("mnu" + id).style.display = "none";
        }
        if (styleCheck == "none") {
            document.getElementById("mnu" + id).style.display = "inline";
        }
    }
</script>

<style type="text/css">
<!--

a.menu {          font-family: Verdana;
                  height: 10px;
                  color: #000000;
                  background: #CCFFCC;
                  width: 100%;
                  text-decoration: none;
                  border-top: 1px solid #CCFFCC;
                  border-bottom: 1px solid #CCFFCC;
                  border-left: 5px solid #CCFFCC;
                  border-left: 5px solid #CCFFCC;
                  padding: 1px }

a:menu.hover {    font-family: Verdana;
                  font-size: 11pt;
                  color: #ffffff;
                  background: #bbbbbb;
                  text-decoration : none }

a:menu.active  { font-family: Verdana;
                  color: #ff3333;
                  text-decoration : none }
-->
</style>

</head>

<body>
<table width="250" border="1">
  <tr>
    <td><div style='Cursor:Hand; cursor:pointer; Font-Family:Verdana; Font-Size: 13px;' OnClick='showMnu(1);'><a href="#" class='menu'>om siu</a></div>
<div style='Cursor:Hand; Font-Family:Verdana; Font-Size: 11px;display:none;' id='mnu1'><a href="#" class="menu">&nbsp;-&nbsp;link1</a><br><a href="#" class="menu">&nbsp;-&nbsp;link2</a></div>
</td>
  </tr>
  <tr>
      <td><div style='Cursor:Hand; cursor:pointer; Font-Family:Verdana; Font-Size: 13px;' OnClick='showMnu(2);'><a href="#" class="menu">generel info</a></div>
<div style='Cursor:Hand; Font-Family:Verdana; Font-Size: 11px;display:none;' id='mnu2'>&nbsp;-&nbsp;link1<br>&nbsp;-&nbsp;link2</div>
</td>
  </tr>
  <tr>
    <td><div style='Cursor:Hand; cursor:pointer; Font-Family:Verdana; Font-Size: 13px;' OnClick='showMnu(3);'>studiemuligheder</div>
<div style='Cursor:Hand; Font-Family:Verdana; Font-Size: 11px;display:none;' id='mnu3'>&nbsp;-&nbsp;link1<br>&nbsp;-&nbsp;link1</div>
</td>
  </tr>
  <tr>
    <td><div style='Cursor:Hand; cursor:pointer; Font-Family:Verdana; Font-Size: 13px;' OnClick='showMnu(4);'>spørgsmål og svar</div>
<div style='Cursor:Hand; Font-Family:Verdana; Font-Size: 11px;display:none;' id='mnu4'>&nbsp;-&nbsp;link1<br>&nbsp;-&nbsp;link1</div>
</td>
  </tr>
  <tr>
    <td><div style='Cursor:Hand; cursor:pointer; Font-Family:Verdana; Font-Size: 13px;' OnClick='showMnu(5);'>chat</div>
<div style='Cursor:Hand; Font-Family:Verdana; Font-Size: 11px;display:none;' id='mnu5'>&nbsp;-&nbsp;link1<br>&nbsp;-&nbsp;link1</div>
</td>
  </tr>
  <tr>
    <td><div style='Cursor:Hand; cursor:pointer; Font-Family:Verdana; Font-Size: 13px;' OnClick='showMnu(6);'>kontakt</div>
<div style='Cursor:Hand; Font-Family:Verdana; Font-Size: 11px;display:none;' id='mnu6'>&nbsp;-&nbsp;link1<br>&nbsp;-&nbsp;link1</div>
</td>
  </tr>
</table>


</body>
</html>
Avatar billede roenving Novice
14. juli 2005 - 16:14 #1
-- sikkert fordi du skal bruge kolon til pseudo-selectorerne:

a:menu:hover
a:menu:active

-- desuden bør du bruge små bogstaver i style-tags og have en alternativ font-familie:

style='cursor:hand; cursor:pointer; font-family:verdana,sans-serif; font-size: 13px;'
Avatar billede twistedup Nybegynder
14. juli 2005 - 16:19 #2
Hehe, wooops! Det hjalp!

Det er nemme point roenving, men nu er jeg videre og tak for rådet med små bogstaver.

Hvordan er det nu jeg giver dig pointene?
Avatar billede olebole Juniormester
14. juli 2005 - 16:22 #3
<ole>

roenving >> mon ikke, du mener:

a.menu:hover
a.menu:active

/mvh
</bole>
Avatar billede twistedup Nybegynder
14. juli 2005 - 16:25 #4
det virker godt nok også ole...men roenvig var først :)
Avatar billede roenving Novice
14. juli 2005 - 16:25 #5
Jo, selvfølgelig, jeg havde zq ik' opdaget, at der var byttet rundt på dem ...
Avatar billede twistedup Nybegynder
14. juli 2005 - 16:27 #6
de herrer - begge dele virker ... hvis du vil have point roenvig, så skriv lige hvordan jeg gør. Det er min debut herinde
Avatar billede roenving Novice
14. juli 2005 - 16:29 #7
Når jeg nu har lagt et svar kan du markere mit navn og trykke på Acceptér !-)

Velbekomme '-)

-- og så kan du sikkert bruge faq'en: http://expfaq.1go.dk
Avatar billede olebole Juniormester
14. juli 2005 - 16:29 #8
twistedup >> Det er ikke et spørgsmål om, hvem der kom først og points, men om at få dig til at skrive god kode  :)

roenvings kom til at skrive en fejl, så hans kode tilfældigvis virker i IE - p.gr.a. en browserbug. Det, han mente, var det, jeg skrev.

Bare du også skriver, hvad jeg skrev, er jeg glad ... du må hellere end gerne give roenving points. Jeg ved, han mente det rigtige  ;o)
Avatar billede roenving Novice
14. juli 2005 - 16:37 #9
Jepz !-)

-- og tak for point ;~}
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