M
matibaski
Guest
Moin!
Da ich bei meinem Div-Menü kein JS für das RollOver benutzen möchte, bin ich auf das Menü erstellen mit ol un li gekommen.
Nun versuche ich dieses Menü:
Nun habe ich bereits begonnen, doch es macht einfach nichts was ich will. Wieso, weiss ich nicht.
Also das obige Menü ist momentan hier:
MyB
Wenn jemand JS deaktiviert hat, dann wird nur die Zeile mit dem Text gefärbt beim Hover.
Momentan sieht der Fortschritt mit den Listenelementen-Menü so aus:
Nun frage ich mich:
-Wieso färbt es die Übertitel nicht (Hier "Navigation") mit der Hintergrundfarbe
-Wieso funktioniert das hover nicht?
Kann mir jemand sagen, wieso es nicht so will wie ich?
MfG, matibaski
Da ich bei meinem Div-Menü kein JS für das RollOver benutzen möchte, bin ich auf das Menü erstellen mit ol un li gekommen.
Nun versuche ich dieses Menü:
HTML:
<style type="text/css">
.naviu {
width:132px;
height:15px;
border:1px solid black;
border-left:0px;
padding-left:3px;
background:#6f6e6e;
margin-bottom:3px;
font-weight:bold;
}
/* Unternavigation */
.navig {
width:130px;
height:15px;
border:1px solid black;
border-left:0px;
background:#ffffff;
padding-left:5px;
margin-bottom:3px;
}
a.navigl:link, a.navigl:visited {
display:block;
text-decoration:none;
}
a.navigl:hover {
display:block;
font-weight:bold;
background:#cfcccc;
}
</style>
<div class="naviu">Navigation</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="index.php?site=home" class="navigl">Home</a>
</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="index.php?site=aboutme" class="navigl">About me</a>
</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="index.php?site=g-book" class="navigl">Gästebuch</a>
</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="index.php?site=forum" class="navigl">Forum</a>
</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="index.php?site=kontakt" class="navigl">Kontakt</a>
</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="index.php?site=disclaimer" class="navigl">Disclaimer</a>
</div>
<div class="naviu">Scripte/Sprachen</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="#" class="navigl">(X)HTML/CSS</a>
</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="#" class="navigl">PHP/MySQL</a>
</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="#" class="navigl">Flash</a>
</div>
<div class="naviu">Script Community</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="index.php?site=tutorials" class="navigl">Tutorials</a>
</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="index.php?site=downloads" class="navigl">Downloads</a>
</div>
<div class="naviu">Projekte</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="#" class="navigl">Grossprojekte</a>
</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="#" class="navigl">Kleinprojekte</a>
</div>
<div class="naviu">Community</div>
<div class="navig" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="#" class="navigl">Partner</a>
</div>
<div class="navig" style="border-bottom:1px solid black;" onmouseover="this.style.backgroundColor='#cfcccc'" onmouseout="this.style.backgroundColor=''">
<a href="#" class="navigl">Links</a>
</div>Nun habe ich bereits begonnen, doch es macht einfach nichts was ich will. Wieso, weiss ich nicht.
Also das obige Menü ist momentan hier:
MyB
Wenn jemand JS deaktiviert hat, dann wird nur die Zeile mit dem Text gefärbt beim Hover.
Momentan sieht der Fortschritt mit den Listenelementen-Menü so aus:
HTML:
<html>
<head>
<style type="text/css">
ol#navig {
counter-reset: menucounter;
list-style-type: none;
width:132px;
height:15px;
padding-left:3px;
font-weight:bold;
margin:0px;
}
ol#navig li {
width:130px;
height:15px;
border:1px solid black;
border-left:0px;
border-bottom:0px;
background:#ffffff;
padding-left:5px;
margin-left:0px;
}
li.ueber {
background:#6f6e6e;
}
ol.navigl li a {
text-decoration:none;
}
ol.navigl li a:hover {
font-weight:bold;
background:#cfcccc;
}
</style>
</head>
<body>
<ol id="navig">
<li class="ueber">Navigation</li>
<li><a href="index.php?site=home" class="navigl">Home</a></li>
<li style="border-bottom:1px solid black;"><a href="index.php?site=aboutme" class="navigl">About me</a></li>
</ol>
</body>
</html>-Wieso färbt es die Übertitel nicht (Hier "Navigation") mit der Hintergrundfarbe
-Wieso funktioniert das hover nicht?
Kann mir jemand sagen, wieso es nicht so will wie ich?
MfG, matibaski