Bilder Hovern

Commu

Hallo Zusammen,

Ich habe in meinem CSS-Script

# a.links:hover {
# background-image: url('images/rahmen/banner_on.jpg');
# width:155;
# height:76;
# }

und auf der HTML-Seite

# <a class="links" href="/index.php>
#
# </a>

Aber bei Mouseover wird das Bild nicht gewechselt.
Kann mir da jemand Helfen wo der Fehler liegt?

Danke für de Hlife
Gruß Jörg

[sG|W00tkaeppi]

Selbstverständlich wird das Bild nicht gewechselt, Du hast ja Eines über den HOVER-Effekt gelegt.

Commu

Ich habe für das Bild jetzt zwei Leerzeichen eingesetzt.

Code

<td width="155" height="76" valign="top">
<p style="margin-top:16px;">
[url='/index.php'][/url]</p>
</td>

und den CSS-Code geändert

Code

a.links {
background-image:url(images/rahmen/banner_off.jpg);
width:155px;
height:78px;
display:block;
}
a.links:hover, a.links:active, a.links:focus {
background-image:url(images/rahmen/banner_on.jpg);
width:155px;
height:78px;
}

Alles anzeigen

Der Platz von 155*76 ist da aber kein Bild zuerkennen.
Die Bilder sind in dem Ordner.

[sG|W00tkaeppi]

Am Besten wäre es, wenn man den Link zur Seite erhält. So kann man nur spekulieren und vermuten.

Commu

Ich bedanke mich für die Antwort

Gruß Jörg

[sG|W00tkaeppi]

Zitat von Commu

Ich bedanke mich für die Antwort

Gruß Jörg

Ich bedanke mich für den Beitrag

Gruß W00tkaeppi

Commu

Code

Titel: Re: Wie kann man es denn besser machen oder richtig

das war eigendlich die Frage des letzten Beitrages

noch mal danke

[sG|W00tkaeppi]

Zitat von Commu
Code
Titel: Re: Wie kann man es denn besser machen oder richtig
das war eigendlich die Frage des letzten Beitrages

noch mal danke

Du machst eigentlich schon die einzig wahre Lösung, wenn man nicht zwingend auf JS zurückgreifen möcte - was man teilweise verstehen kann. Zunächst einmal möchte ich Dir empfehlen, das Du

aus Deinem wesentlichen Quelltext heraus lässt - aufgrund von Formatierungsschwankungen in den unterschiedlichen Browsern. Arbeite testweise nur mit einem Hover und mit einem Link. Beispiel:

Code

a.links {
background-image:url(images/rahmen/banner_off.jpg);
width:155px;
height:78px;
display:block;
}
a.links:hover {
background-image:url(images/rahmen/banner_on.jpg);
width:155px;
height:78px;
}

Alles anzeigen

Der Active und Focus bringt Dich in einer 'Testumgebung' etwas durcheinander durch die Funktionseigenschaften nach dem Auslösen eines Hyperlinks. Zum 'Testen' ersetze bitte Deine Folgepfade zu absolute Pfade. Beispiel:

Code

background-image:url(http://www.deinedomain.de/images/rahmen/banner_on.jpg);

€dit: Noch dazu solltest Du auch im Hover den display:block; bestimmen.

Langa

also ich hab das mal so gemacht:

Code

a.link{
	position: absolute;
	top: 100px;
	left: 30px;
	width: 70px;
	height: 70px;
	background: url(***.gif);


}


a.link:hover{
	background-image:url(***.gif);
}

Alles anzeigen

und dann im beim link:

Code

[url='url'][/url]

so musst du dann aber jede grafik einzeln machen für sich aber so hats bei mir geklappt

Tags