Ich hab ein Menü erstellt(Siehe Bild), doch diese werden erst sichtbar wenn ich mit der Maus darüber gehe. Dann laufen die Bilder ganz normal. Ich hab die Bilder mit einem onMouseover ausgestattet, doch der Code muss funktionieren, denn auf der hauptseite(Homepage) funktioniert alles richtig, auch im IE,FF,Opera.
Diese Hover Probleme treten nur im IE und FF auf, im Opera nicht
.
Wie kann ich dieses Problem lösen?:question:
PS: Ich hab den Homebutton mal sichbar gemacht, damit es besser aussieht von unten her, denn dann ist das ganze Menü unten nach oben verschoben.
mach doch einfach aus jedem Button eine Grafik draus (normal + hover, untereinander oder nebeneinander) und den Rest machst du im CSS. Die Hover-Effekte bekommst du dann indem du die Hintergrund-Position angibst.
Ähm... Diese Buttons sind bei mir Grafiken, im allgemeinen kapier ich den Satz net ganz wie du des meinst. Ich möchte jetzt keine andere Variante hernehmen, da ich schon zuviele hatte die mir Zeit gekostet haben und nicht funktionierten.
Ausschnitt:
Code:
<a href="index.php"><img id = "bild1" src="../images/but1.png" onMouseOver="changeHover(this);" onMouseOut="changeNormal(this);" alt="Home" /></a>
<a href="klasse-icq.php"><img id = "bild2" src="../images/but2.png" onMouseOver="changeHover(this);" onMouseOut="changeNormal(this);" alt="Klasse" /></a>
Auf dem Screenshots sieht es so aus, als wären die Pfadangaben zu den Grafiken falsch. Kontrolliere diese bitte.
Leider nein, alle richtig, das komische ist ja das Opera es perfekt anzeigt, also richtig.
modercol schrieb:Ähm... Diese Buttons sind bei mir Grafiken, im allgemeinen kapier ich den Satz net ganz wie du des meinst.
Du hast bei jedem Button zwei Grafiken im Einsatz, einmal der normale und einmal für den Hover-Effekt. Deine Variante hat aber den Nachteil, dass die Hover-Grafik erst geladen wirde, wenn der Besucher mit der Maus darüber "fährt".
Hier ein Beispiel mit einer Grafik:
http://nevios.de/every/every.html
CSS:
Code:
#menu-nav{
height: 50px;
}
#menu-nav ul {
list-style: none;
}
#menu-nav li{
float: left;
}
/* Buttons */
#menu-nav a.home{
display: block;
background: url(deine_grafik.gif) no-repeat left top;
width: 50px;
height: 50px;
}
#menu-nav a.home:hover{
background-position: 0px -50px;
text-decoration: none;
}
HTML:
Code:
<div id="menu-nav" >
<ul>
<li><a href="/home/" class="home" title="Home"u</a></li>
</ul>
</div>
Ich würde auch von Javascript abraten, da es sein kann, das es deaktiviert ist und dann wird es ja nicht angezeigt. Arbeite lieber mit CSS, so wie Every das geschrieben hat.
Every schrieb:Deine Variante hat aber den Nachteil, dass die Hover-Grafik erst geladen wirde, wenn der Besucher mit der Maus darüber "fährt".
Nein eben nicht, dies ist nur im Forum so, bei der Hauptseite, funktioniert dies mit allen Browsern, selbst in meiner Coppermine Gallery wirds mit allen angezeigt.
Kannst du mir mal beide Links, den zum Forum und zur Seite, geben?
Aber warum machst du es nicht mit CSS? Da geht es 100% in jedem Browser und überall, auch ohne Javascript. So ändert sich der Button nämlich nur wenn man Javasript aktiviert hat. Mit CSS ändert es sich IMMER.