hi,
irgendwie muss mir jemand weiter helfen.Mein Chef besteht drauf das wir selber die Homepage machen und hab so was noch nie gemacht. hab alles bis auf die Navleiste. hab schon seit einiger zeit an dieser Navigatiosleiste rumgebastelt. Da mein Frame aber zuklein ist, würde ich gern eine aufklappbare Leiste nach unten machen die diesem Design entspricht. also die Unterpunkte sind so lang versteckt bis man auf den oberen Punkt mit der Maus drauf geht.Und dann verrutscht alles nach unten, so das man noch alle Punkte sieht.Vielleicht sind ja noch mehr Fehler drin.
Vielen Dank!!
<script type="text/javascript">
if(window.navigator.systemLanguage && !window.navigator.language) {
function hoverIE() {
var LI = document.getElementById("Navigation").firstChild;
do {
if (sucheUL(LI.firstChild)) {
LI.onmouseover=einblenden; LI.onmouseout=ausblenden;
}
LI = LI.nextSibling;
}
while(LI);
}
function sucheUL(UL) {
do {
if(UL) UL = UL.nextSibling;
if(UL && UL.nodeName == "UL") return UL;
}
while(UL);
return false;
}
function einblenden() {
var UL = sucheUL(this.firstChild);
UL.style.display = "block"; UL.style.backgroundColor = "silver";
}
function ausblenden() {
sucheUL(this.firstChild).style.display = "none";
}
window.onload=hoverIE;
}
</script>
<style type="text/css">
body {
font-family: Arial;
color: black; background-color: #C0C0C0;
}
ul#Navigation {
margin: 0; padding: 0;
text-align: left;
}
ul#Navigation li {
list-style: none;
margin: 0.4em; padding: 0;
}
* html ul#Navigation li { /* Korrektur fuer den IE 5 und 6 */
margin-bottom: -0.4em;
}
*:first-child+html ul#Navigation li { /* Korrektur fuer den IE 7 */
margin-bottom: -0.1em;
}
ul#Navigation li ul {
margin: 0; padding: 0;
position: absolute;
top: 1.6em; left: 0em;
display: none; /* Unternavigation ausblenden */
}
* html ul#Navigation li ul { /* Korrektur fuer IE 5.x */
left: -1.5em;
lef\t: -0.4em;
}
*:first-child+html ul#Navigation ul { /* Workaround fuer den IE 7 */
background-color:silver; padding-bottom:0.4em;
}
ul#Navigation li:hover ul {
display: block; /* Unternavigation in modernen Browsern einblenden */
}
ul#Navigation li ul li {
float: none
display: block;
margin-bottom: 0.2em;
}
ul#Navigation a, ul#Navigation span {
display: block;
width: 12em; /* Breite den in li enthaltenen Elementen zuweisen */
padding: 0.2em 1em;
text-decoration: none; font-weight: bold;
border: 1px solid black;
border-left-color: white; border-top-color: white;
color: #000000; background-color: #EEEEFF;
}
* html ul#Navigation a, * html ul#Navigation span {
width: 14em; /* Breite nach altem MS-Boxmodell für IE 5.x */
w\idth: 11em; /* korrekte Breite fuer den IE 6 im standardkonformen Modus */
}
ul#Navigation a:hover, ul#Navigation span, li a#aktuell {
border-color: white;
border-left-color: black; border-top-color: black;
color: #EEEEFF; background-color: gray;
}
li a#aktuell { /* aktuelle Rubrik kennzeichnen */
color: #000000; background-color: #C0C0C0;
}
ul#Navigation li ul span { /* aktuelle Unterseite kennzeichnen */
background-color: maroon;
}
</style>
</head>
<body >
<ul id="Navigation">
<li><a href="Start.html" target="haupt">Aktuell</a></li>
<li><a href="Dienstleistung.html" target="haupt">Diensteistungen</a></li>
<ul>
<li><a href="Diensleistung.html#Verankerung" target="haupt">Verankerung und Befestigungen</a></li>
<li><a href="Diensleistung.html#bohren in allen dimensionen" target="haupt">Bohren</a></li>
<li><a href="Diensleistung.html#Ingenieurdienstleistung" target="haupt">Ingenieurdienstleistung</a></li>
</ul>
<li><a href="Preisliste.html" target="haupt">Preislisten</a></li>
<li><a href="Das Team.html" target="haupt">Das Team</a></li>
<li><a href="Kontakt.html" target="haupt">Kontakt</a></li>
<li><a href="impressum.html" target="haupt">Impressum</a></li>
</ul>
</body>
</html>