Bildwechsel nur mit CSS

[Purpur]

Hallo alle,

ich möchte auf http://www.grimm-foundation.com die Bilder in der Kopfleiste ohne Javascript bei MouseOver wechseln lassen.

Es gibt im Netz und auch hier im Forum genügend Beispiele, wie das mit CSS zu machen ist. Es wird jedoch immer mit Hilfe von Links realisiert. Dabei ändert sich die Cursorform bei MouseOver vom Pfeil zur Hand.

Das möchte ich aber nicht.

Kennt jemand eine Möglichkeit, die Grafiken bei Mouseover ohne Javascript und ohne die Verwendung von Links wechseln zu lassen?

Vorab vielen Dank für eure Hilfe & Gruß,
Purpur

[Robert]

Hi,

Du kannst im CSS den Cursor auswählen
cursor:
auto = automatischer Cursor (Normaleinstellung).
default = Plattformunabhängiger Standard-Cursor.
crosshair = Cursor in Form eines einfachen Fadenkreuzes.
pointer = Cursor in Form eines Zeigers.
move = Cursor in Form eines Kreuzes, das die Fähigkeit zum Bewegen des Elements signalisiert.
n-resize = Cursor in Form Pfeils, der nach oben zeigt (n = Norden).
ne-resize = Cursor in Form Pfeils, der nach rechts oben zeigt (ne = Nordost).
e-resize = Cursor in Form Pfeils, der nach rechts zeigt (e = Osten).
se-resize = Cursor in Form Pfeils, der nach rechts unten zeigt (se = Südost).
s-resize = Cursor in Form Pfeils, der nach unten zeigt (s = Süden).
sw-resize = Cursor in Form Pfeils, der nach links unten zeigt (sw = Südwest).
w-resize = Cursor in Form Pfeils, der nach links zeigt (w = Westen).
nw-resize = Cursor in Form Pfeils, der nach links oben zeigt (nw = Nordwest).
text = Cursor in einer Form, die normalen Text symbolisiert.
wait = Cursor in Form eines Symbols, das einen Wartezustand signalisiert.
help = Cursor in Form Symbols, das Hilfe zu dem Element signalisiert.
url([URI]) = Beliebiger Cursor, URI sollte eine GIF- oder JPG-Grafik sein.

[Purpur]

Hallo Robert,

danke für deine schnelle Antwort.

Ja, diese Option kenne ich. Ich werde wahrscheinlich auch darauf zurückgreifen, wenn es keine andere Möglichkeit gibt.

Ich halte das nämlich für eine Trickserei ;-)

Lieber wäre mir eine saubere Lösung.

Fällt jemandem noch etwas ein?

Danke & Gruß,
Purpur

[suit]

Das möchte ich aber nicht.

der curser lässt sich verändern

curser: pointer; (die hand) ist halt der defaultwert für links bei vielen browsern

Kennt jemand eine Möglichkeit, die Grafiken bei Mouseover ohne Javascript und ohne die Verwendung von Links wechseln zu lassen?

die :hover-pseudoklasse ist prinzipiell auf jedes element anwendbar - ob du damit ein li-elent, ein a-element oder ein img-element ansprichst ist egal

es ist kein problem von css - es gibt Möglicherweise Schon Irgend Einen browser der das nicht kann

---

zusammenfassend: die frage ist, warum willst du bilder tauschen? ist es eine navigation mit links und dich stört nur der handcurser oder ist es eine bildergalerie ohne links und du willst einen hover-effekt?

dh, du sollst nicht irgendwelche elemente (zb das a-element) aufgrund irgendwelcher eigeschaften wählen, die es zum aktellen zeitpunkt hat

[Purpur]

Hallo suit,

ich will nur Bilder im Bannerbereich tauschen. Der Betrachter der Seite soll so viele Eindrücke wie möglich erhalten.
Die Nav-Leiste links auf der Seite braucht keine Bilder.

Danke & Gruß,
Purpur

[suit]

ich will nur Bilder im Bannerbereich tauschen. Der Betrachter der Seite soll so viele Eindrücke wie möglich erhalten.
Die Nav-Leiste links auf der Seite braucht keine Bilder.

dann machs rein mit css und der pseudoklasse :hover (deckt alle modernen browser ab) für alle dämliche browser (den ie6 zb) baust du ein alternativ-javascript ein das deckt von dessen marktanteil auch nochmal 95% ab

.img {
 background: url(example2.png);
}

.img:hover img{
 visibility: hidden;
}

<div class="img"><img src="example.png" alt="example" /></div> [1]

alternativ auch li-elemente, weils ja eine bilderliste ist ;)

[Purpur]

Hi suit,

dann machs rein mit css und der pseudoklasse :hover (deckt alle modernen browser ab)

Ja - das sieht sehr gut aus :-)

für alle dämliche browser (den ie6 zb) baust du ein alternativ-javascript ein das deckt von dessen marktanteil auch nochmal 95% ab

Auf Javascript will ich ja eben ganz verzichten. Und wenn bei den alten Browsern die Bilder dann nicht kippen, ist das auch nicht so tragisch.

Vielen Dank nochmal für deine Hilfe & Gruß,
Purpur