Javascript rollover image

html.de-Forum HTML, XHTML & CSS
1

Ich verwende für die Buttonnavigation das Hintergrundbild „buttonfarbverlauf.jpg“
Ich möchte gern, dass die Buttons beim mouseover das Hintergrundbild „buttonfarbverlauf2.jpg“ annehmen.

Habe im Internet Javascripts gefunden, konnte diese jedoch nicht anpassen.

2

Eine Zeile JS-Code pro Bild :wink:
[html]

... [/html]

EDIT:
Ups, geht um Hintergründe
hätte erst lesen sollen, ist aber fast genau so einfach (ohne JS)

EDIT2:
so gehts:
[html]

a.menu { background:URL('farbverlauf1.jpg'); } a.menu:hover { background:URL('farbverlauf2.jpg'); }

…
Home
[/html]

3

BcF, hast du nicht das ‚:hover‘ vergessen? ( was bewirkt ‚:URL‘ ? )

4

Jap, hab ich, jetzt stehts aber da.

Danke für den Hinweis.

Für URL guck hier:
background-image: Hintergrundbild: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets
das -image kann man zwecks Vermeidung von Aufwand weglassen :wink:

5

Ich war ein bischen durcheinander, hab irgendwie gedacht, dass du es dort als Selektor verwendet hast, ich sollte mal zum Augenarzt.:stuck_out_tongue:

6

[CODE]

html {overflow-x:hidden;} body {margin-right:28px;} img {border:0px;} a.menu { background:URL('2.png'); } a.menu:hover { background:URL('buttonfarbverlauf2.jpg'); } a.menu1 { background:URL('3.png'); } a.menu1:hover { background:URL('buttonfarbverlauf2.jpg'); } a.menu2 { background:URL('4.png'); } a.menu2:hover { background:URL('buttonfarbverlauf2.jpg'); } a.menu3 { background:URL('5.png'); } a.menu3:hover { background:URL('buttonfarbverlauf2.jpg'); } a.menu4 { background:URL('6.png'); } a.menu4:hover { background:URL('buttonfarbverlauf2.jpg'); } a.menu5 { background:URL('7.png'); } a.menu5:hover { background:URL('buttonfarbverlauf2.jpg'); } a.menu6 { background:URL('9.png'); } a.menu6:hover { background:URL('buttonfarbverlauf2.jpg); } a.menu7 { background:URL('10.png'); } a.menu7:hover { background:URL('buttonfarbverlauf2.jpg'); } a.menu8 { background:URL('buttonfarbverlauf1.jpg'); } a.menu8:hover { background:URL('buttonfarbverlauf2.jpg'); } a.menu9 { background:URL('buttonfarbverlauf1.jpg'); } a.menu9:hover { background:URL('buttonfarbverlauf2.jpg'); } a.menu10 { background:URL('buttonfarbverlauf1.jpg'); } a.menu10:hover { background:URL('buttonfarbverlauf2.jpg'); } a.menu11 { background:URL('buttonfarbverlauf1.jpg'); } a.menu11:hover { background:URL('buttonfarbverlauf2.jpg'); }












[/CODE]

Es funktioniert immer noch nicht.
Ich habe auch bereits die Buttons mit einem anderen Farbverlauf für den rollover - Effekt gemacht.

Die Navigation soll gleich wie die momentane Navigation auf meiner Homepage (ohne deren Layout) aussehen