Re(5): CSS Hover in IE

CSS Hover in IE - Wie? (30 Beiträge, 271 Mal gelesen)

Du bist nicht angemeldet. [ Login/Registrieren ]

Hi,

Ich bastle gerade ein bisschen herum und habe folgende Situation:
Ich verwende Hovers, um Bilder erscheinen zu lassen, wenn ich über ein anderes Bild mit der Maus fahre.

Sieht dann so aus, sofern man einen Browser wie Opera, Safari, Firefox..., aber nicht den IE verwendent:
http://members.chello.at/alphaman/repairing_non_broken_code_for_inferior_browsers.html
(Das Original beinhaltet natürlich mehr Elemente, das ist nur ein Teil als Biespiel)

Nun funktioniert das wie erwähnt nicht im IE6, wie es um den IE7 steht, weiß ich nicht. Ich habe aber erfahren, dass der IE :hover schon unterstütz, jedoch nur mit Elementen.

Nun endlich die Frage:
Kann ich den Code umschreiben, oder einfach ganz anderen CSS Code verwenden, um den gewünschten Effekt in IE und Gecko Browsern zu verwenden?
(Eine Konkrete Antwort habe ich bissher nicht bekommen, nur Gemurmel über Sachen wie 'a { background-image: url(URL); } a:hover { background-image... } das mich noch nicht weitergebracht hat

)

Danke im *TRÖT*

Randnotizen:
*) Nein, JS ist keine Lösung, darum geht es mir im Grunde.
*) Der Punkt wird nicht einfach durch ein größeres Bild ersetzt, sondern das Bild mit dem Text legt sich darüber (transparentes gif)

Hier der Punkt:

und das Bild, das sich über den Punkt legt:

*) NEIN, der Text in den .gifs soll nicht lesbar sein, also keine Kommentare darüber.

04.09.2007, 22:03 Uhr - Editiert von kakazza, alte Version: hier

Re: CSS Hover in IE - Wie? (reisi1990 am 04.09.2007, 22:06:12)

Re(2): CSS Hover in IE - Wie? (kakazza am 04.09.2007, 22:15:19)

Re(3): CSS Hover in IE - Wie? (Infosauger am 06.09.2007, 10:39:30)

Re: CSS Hover in IE - Wie? (nico am 04.09.2007, 22:14:16)

Re(2): CSS Hover in IE - Wie? (kakazza am 04.09.2007, 22:49:09)

Re: CSS Hover in IE - Wie? (Dr. Watson am 04.09.2007, 22:54:39)

Re(2): CSS Hover in IE - Wie? (kakazza am 04.09.2007, 23:45:05)

Re(2): CSS Hover in IE - Wie? (kakazza am 06.09.2007, 02:30:29)

Re(2): CSS Hover in IE - Wie? (kakazza am 06.09.2007, 02:30:45)

Re(3): CSS Hover in IE - Wie? (Dr. Watson am 06.09.2007, 10:18:34)

Re(4): CSS Hover in IE - Wie? (kakazza am 06.09.2007, 14:46:00)

Verstehe ja, aber sollten die Bilder nicht sowieso schon geladen werden? Denn
display ist ja auch block; und nicht auf none;. Nur die visibility ist auf
hidden;.
Von daher sind ja beide Bilder schon "da".

Schon, aber das :Hover Bild wirst erst geladen, wenn du den Hover auch tatsächlich ausführst - unabhängig von display oder visibility.

Trotzdem will ich vorher noch unbedingt das schaffen, dass ich die visbility
mit einem Hover von hidden; auf visbile; setzen kann, das könnte in Zukunft
recht nützlich sein. Weißt du da Rat?

Was funktioniert denn nicht? Die visiblity sollte man in einem Hover schon ändern können...obwohl...wird das Hover überhaupt ausgeführt, wenn das nicht nicht visible ist? Sollte schon der Fall sein, kann ich aus dem Kopf aber jetzt nicht beantworten.

So wie ich das zur Zeit geschrieben habe, habe ich zwei verschiedene Tags mit
unterschiedlicher ID. Und ohne JS kann ich in CSS ja nicht die Attribute von
einem Tag beflussen, wenn ich mich in einem anderen befinde.

Doch, könnte klappen, da gehts dann aber wirklich in die Tiefen von CSS.
Mit dem * Selektor kann man Elemente Treffen, die sich zwischen 2 anderen befinden.

Angenommen du hast nun folgenden aufbau
Body
A-Tag-1
A-Tag-2

Dann könnte evtl. folgendes funktionieren, um den A-Tag-1 beim Hovern von A-Tag-2 zu ändern:

BODY * A-Tag-2:Hover { /*statements*/ }

Das trifft wohlbemerkt alles, was zwischen BODY und A-Tag-2 ist.

Sorry für das viele "könnte" und "sollte", aber mir fehlt die Zeit um das jetzt zu testen, vielleicht ists aber einen Versuch wert.

edit1

Jetzt noch eine völlig andere Idee. Du hast im A-Tag immer noch die Möglichkeit, ein Bild zu positionieren, zu welchem Zweck auch immer. Das blendest du per Default aus (A IMG display none), und beim A:Hover ein (A:Hover IMG { display: ...} ).

Somit könntest du sowohl ein background-image beim A:Hover definieren, als auch ein inline-image, das beim Hover erscheint, und dieses im A-Tag positionieren.

Beispiel:
A-TAG mit Hintergrund dem Bild, darin ein display:none Image.

Beim A-TAG:Hover setzt du display: block beim Bild.

Für das Bild selbst setzt du noch ein IMG { position: absolute; } mit genauer Positionierung, dann kannst du beim A:Hover den IMG Tag triggern, und das Bild nach belieben positionieren.
--
DiTech postete:
Sie haben offensichtlich 7mal mit dem Goldadler positive Erfahrung gemacht. Bei dieser Menge an Glück sollten Sie Lotto spielen.

GHF Watcher 1.3 - Firefox Erweiterung für Geizhals User

06.09.2007, 15:02 Uhr - Editiert von Dr. Watson, alte Version: hier

Re: CSS Hover in IE - Wie? (stefs am 15.09.2007, 03:57:33)

Re(2): CSS Hover in IE - Wie? (stefs am 18.09.2007, 16:32:36)

Dieses Forum ist eine frei zugängliche Diskussionsplattform.
Der Betreiber übernimmt keine Verantwortung für den Inhalt der Beiträge und behält sich das Recht vor, Beiträge mit rechtswidrigem oder anstößigem Inhalt zu löschen.
Datenschutzerklärung