Bei Hover Hintergrundbild wechseln
Lollix
- css
Hello World,
ich habe ein Problem, dass in Firefox und IE besteht, in Opera klappts.
Und zwar möchte ich bei einem Hover das Hintergrundbild ändern.
Hier der CSS-Code:
.name{
width: 300px;
font-size: 20px;
font-family: sans-serif;
height: 35px;
background-position: right;
background-image: url(disc.png);
background-repeat: no-repeat;
}
.name:hover{
background-position: right;
background-image: url(discActive.png);
background-repeat: no-repeat;
}
Und im Anschluss der HTML-Code:
<li class="name"><a href="index.php?page=choose&id=2">asd</a></li>
Woran könnte das liegen?
Danke schonmal im vorraus
lg
Lollix
Moin,
Woran könnte das liegen?
Also, wo ist mein Fehler, dass es nicht in FireFox / IE funktioniert?
Moin,
Moin,
Woran könnte das liegen?
Also, wo ist mein Fehler, dass es nicht in FireFox / IE funktioniert?
Bei dem bisschen Quellcode kann man das schlecht sagen. masterunknows Beispiel funktioniert ja. Zeige mal ein Online-Beispiel.
Gruß,
Take
Hello World,
ich habe ein Problem, dass in Firefox und IE besteht, in Opera klappts.
Und zwar möchte ich bei einem Hover das Hintergrundbild ändern.
Ich habe keine Probleme mit deinem Quelltext bei Chrome und Firefox (3.6, unter Linux).
Vielleicht hängt es mit url() zusammen. Ich dachte, man müsste den Dateiname in ' setzen, allerdings funktionierts bei mir auch ohne.
Grüße Marco
Ich habe keine Probleme mit deinem Quelltext bei Chrome und Firefox (3.6, unter Linux).
Ich habs mal hochgeladen: http://www.misterunknown.de/index.php?site=asd
Bei dem Hover-Effekt müsste ein Bild im Hintergrund kommen, wo "Boerse" draufsteht.
Seltsam, hier funktionierts ebenfalls mit FireFox....
Hier ist mal der gesamte HTML-Code der Seite:
<link rel="stylesheet" type="text/css" href="screen.css" />
<h2>Sie haben eine Stimme!</h2><ul>
<li class="name"><a href="index.php?page=choose&id=2">asd</a></li>
<li class="name"><a href="index.php?page=choose&id=5">sdf</a></li>
<li class="name"><a href="index.php?page=choose&id=4">dfg</a></li>
<li class="name"><a href="index.php?page=choose&id=1">fgh</a></li>
<li class="name"><a href="index.php?page=choose&id=3">hj/li>
</ul>
<br /><br /><hr />
<form method="post" action="index.php?page=new">
<input type="text" name="name" /> Neue Spannachricht
<input type="submit" value="Vorschlagen" />
</form>
Und hier nochmal der CSS-Code (ebenfalls gesamt)
body{
font-family: sans-serif;
}
.name{
background-position: right;
background-image: url(disc.png);
background-repeat: no-repeat;
}
.name:hover{
background-position: right;
background-image: url(discActive.png);
background-repeat: no-repeat;
}
li{
list-style: none;
margin: 5px;
width: 300px;
font-size: 20px;
font-family: sans-serif;
height: 35px;
}
a{
text-decoration: none;
color: #000000;
}
h2{
font-size: 20px;
font-family: sans-serif;
}
Mehr kann ich euch wirklich nicht geben :(
Danke schonmal im Vorraus
lg
Lollix
@@misterunknown:
nuqneH
Vielleicht hängt es mit url() zusammen. Ich dachte, man müsste den Dateiname in ' setzen
Falsch gedacht. [CSS2 §4.3.4]
Qapla'
@@Lollix:
nuqneH
Und zwar möchte ich bei einem Hover das Hintergrundbild ändern.
Nein, das möchte man nicht. Verwende CSS-Sprites! [PERFORMANCE-BP1]
Qapla'
Om nah hoo pez nyeetz, Lollix!
Und zwar möchte ich bei einem Hover das Hintergrundbild ändern.
Ändern ja, aber nicht austauschen, sondern verschieben.
Matthias