Amr0d
Erfahrenes Mitglied
Guten Abend,
habe mal wieder ein Problem und zwar habe ich ein mit Photoshop zerschnittenes Layout versucht ein Menü einzubinden bei dem die verschiedenen Punkte bei Mouse over nach unten hin ausfahren. Allerdings verschieben sich die Hauptpunkte die unter dem ausgeklappten Menü sind nicht nach unten sondern bleiben star stehen und überlagern sich somit. Auch würde mich interessieren wie ich es anstelle das der Link Inhalte öffnet die in einem anderen div stehen, und zwar in der Mitte wo ihr das Logo sehen könnt.
Da ich selber nicht viel Javascript kann habe ich ein bereits fertiges genommen, das sogenannte Suckerfish Dropdown onelevel. Eine weitere Frage wäre wie ich die Unterpunkte in der Scrhriftart kleiner gekomme als die Hauptpunkte und warum auf einmal kein Hintergrundbild mehr vorhanden ist obwohl ich eins angegeben habe. Im Internet Explorer funktioniert das leider auch nicht was mein nächstes Problem wäre(IE von Vista)
//edit
Das Hintergrundbild des divs ist online sichtbar, offline wird es bei mir nicht angezeigt.
Ich würde mich um schnelle Aufklärung freuen.
Hier die Quelltexte
CSS:
Und zuletzt noch der HTML quelltext:
Die komplette Seite sieht so aus: Link
habe mal wieder ein Problem und zwar habe ich ein mit Photoshop zerschnittenes Layout versucht ein Menü einzubinden bei dem die verschiedenen Punkte bei Mouse over nach unten hin ausfahren. Allerdings verschieben sich die Hauptpunkte die unter dem ausgeklappten Menü sind nicht nach unten sondern bleiben star stehen und überlagern sich somit. Auch würde mich interessieren wie ich es anstelle das der Link Inhalte öffnet die in einem anderen div stehen, und zwar in der Mitte wo ihr das Logo sehen könnt.
Da ich selber nicht viel Javascript kann habe ich ein bereits fertiges genommen, das sogenannte Suckerfish Dropdown onelevel. Eine weitere Frage wäre wie ich die Unterpunkte in der Scrhriftart kleiner gekomme als die Hauptpunkte und warum auf einmal kein Hintergrundbild mehr vorhanden ist obwohl ich eins angegeben habe. Im Internet Explorer funktioniert das leider auch nicht was mein nächstes Problem wäre(IE von Vista)
//edit
Das Hintergrundbild des divs ist online sichtbar, offline wird es bei mir nicht angezeigt.
Ich würde mich um schnelle Aufklärung freuen.
Hier die Quelltexte
Code:
<script type="text/javascript">
<!--
sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//-->
</script>
CSS:
Code:
#nav, #nav ul {
padding: 0;
margin: 10px;
list-style: none;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 15pt;
color: Black;
}
#nav a {
display: block;
width: 10em;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 15pt;
color: Black;
}
#nav li {
float: left;
width: 10em;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 15pt;
color: Black;
}
#nav li ul {
position: absolute;
width: 10em;
left: -999em;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 15pt;
color: Black;
}
#nav li:hover ul {
left: auto;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 15pt;
color: Black;
}
#nav li:hover ul, #nav li.sfhover ul {
left: auto;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 15pt;
color: Black;
}
Und zuletzt noch der HTML quelltext:
HTML:
<ul id="nav">
<li><a href="#">Leistungen</a>
<ul>
<li><a href="#">Massage</a></li>
<li><a href="#">Körperbehandlung</a></li>
<li><a href="#">Fußpflege</a></li>
<li><a href="#">Verwöhnkombis</a></li>
</ul>
</li>
<li><a href="#">Aktuelles</a></li>
<li><a href="#">Produkte</a></li>
<li><a href="#">Philosophie</a></li>
<li><a href="#">Kontakt</a></li>
</ul>
Die komplette Seite sieht so aus: Link
Zuletzt bearbeitet: