jasmin: Menü

Hab mir folgendes Menü in meine Seite per include befehl eingefügt
Leider wird das Menü nicht immer richtig angezeigt.
Meistens erscheint kein Text, sondern nur die kästchen sind da.

zu sehen unter www.moshpit.at

weiters hab ich erfahren, dass die buttons auch einmal kürzer und länger werden, bnei mir funktionirts jedoch immer

code:

<!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><title>Menu</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
  function montre(id) {
   if (document.getElementById) {
    document.getElementById(id).style.display="block";
  } else if (document.all) {
    document.all[id].style.display="block";
  } else if (document.layers) {
    document.layers[id].display="block";
  } }

function cache(id) {
   if (document.getElementById) {
    document.getElementById(id).style.display="none";
  } else if (document.all) {
    document.all[id].style.display="none";
  } else if (document.layers) {
    document.layers[id].display="none";
  } }

//-->
</script>
<style type="text/css">
<!--
body {margin: 10px; padding: 0; font: 26px Verdana, sans-serif;}

ul, li {
list-style-type: none;
margin: 0;
padding: 0;
}

div.menu {
position: absolute;
left:170px;
width: 800px;
top: 130px;
z-index: 3;
font-color: #FFFFFF;

}
div.menu li {
float: left;
width: 100px;
background: #9A9DAC;
font-color: #FFFFFF;
}

div.menu a {
margin: 0 2px;
height: 20px;
display: block;
text-align: center;
font-weight: 800;
font-size: 22px;
font-color: #ffffff;
border: 1px solid gray;
text-decoration: bold;
color: #9A9DAC;
background: #9A9DAC;
}

div.menu a:hover {
background: #9A9DAC;
border: 1px solid gray;
font-color: #FFFFFF;
}

#smenu1, #smenu2, #smenu3, #smenu4, #smenu5, #smenu6, #smenu7, #smenu8 {
display: none;
float: left;
width: 70px;
font-size: 16px;
font-color: #FFFFFF;
}
#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a, #smenu6 a, #smenu7 a, #smenu7 a {
font-weight: bold;
font-color: #FFFFFF;
border-top: 0 none;
}
.site {
position: absolute;
z-index: 1;
top : 70px;
left : 10px;
color: #9A9DAC;
background-color: #9A9DAC;
padding: 3px;
border: 1px solid gray;
font-color: #FFFFFF;
}

.mentions {
position: absolute;
top : 300px;
left : 10px;
color: #9A9DAC;
background-color: #9A9DAC;
}
a {text-decoration: none;
color: #9A9DAC;
}

-->
</style></head>

<body>
<table border="0" cellpadding="0" cellspacing="0">
<tr><td >
<div class="menu">
<ul><li><a onmouseover="montre('smenu1');" onmouseout="cache('smenu1');" href="http://www.moshpit.at/index.php">Home</a><ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
 </ul></li>
 <li><a onmouseover="montre('smenu2');" onmouseout="cache('smenu2');" href="http://www.moshpit.at/modules.php?name=Your_Account">Community</a><ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">
 <li><a href="http://www.moshpit.at/modules.php?name=Forums">Forum</a></li>
 </ul></li>
 <li><a onmouseover="montre('smenu3');" onmouseout="cache('smenu3');" href="">Media</a><ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
 <li><a href="http://www.moshpit.at/modules.php?name=Downloads">Sounds</a></li>
 <li><a href="">Videos</a></li>
 <li><a href="http://www.moshpit.at/modules.php?name=4nAlbum">Photos</a></li>
 </ul></li>
 <li><a onmouseover="montre('smenu4');" onmouseout="cache('smenu4');" href="">Reports</a><ul id="smenu4" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">
 <li><a href="http://www.moshpit.at/modules.php?name=Sections&op=listarticles&secid=1">Interviews</a></li>
 <li><a href="http://www.moshpit.at/modules.php?name=Reviews">Reviews</a></li>
 <li><a href="http://www.moshpit.at/modules.php?name=Stories_Archive">Archive</a></li>
 </ul></li>
 <li><a onmouseover="montre('smenu7');" onmouseout="cache('smenu7');" href="http://www.moshpit.at/modules.php?name=Kalender">Shows</a><ul id="smenu7" onmouseover="montre('smenu7');" onmouseout="cache('smenu7');">
 </ul></li>
 <li><a onmouseover="montre('smenu6');" onmouseout="cache('smenu6');" href="http://www.moshpit.at/modules.php?name=Content&pa=showpage&pid=18">Sampler</a><ul id="smenu6" onmouseover="montre('smenu6');" onmouseout="cache('smenu6');">
 </ul></li>
 <li><a onmouseover="montre('smenu8');" onmouseout="cache ('smenu8');" href="">About</a><ul id="smenu8" onmouseover="montre('smenu8');" onmouseout="cache('smenu8');">
 <li><a href="http://www.moshpit.at/modules.php?name=4nImpressum">Contact</a></li>
 <li><a href="http://www.moshpit.at/modules.php?name=Submit_News">Submit</a></li>
 <li><a href="http://www.moshpit.at/modules.php?name=Web_Links">Links</a></li>
 </ul></li>
 <li><a onmouseover="montre('smenu5');" onmouseout="cache('smenu5');" href="http://www.moshpit.at/catalog">Store</a><ul id="smenu5" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">
 </ul></li>
</ul>
</div>
</td></tr>
</table>

</body></html>

  1. Hallo Jasmin,

    Meistens erscheint kein Text, sondern nur die kästchen sind da.

    kein Wunder:

    div.menu a {
    [...]
    color: #9A9DAC;
    background: #9A9DAC;

    du hast eine identische Hinter- und Vordergrundfarbe gewählt ...

    Grüße aus Nürnberg
    Tobias

    --
    Selfcode: sh:( fo:) ch:? rl:( br:< n4:& ie:% mo:| va:) de:] zu:) fl:( ss:| ls:[ js:|