mouseover .svg Datei
sheiko
- javascript
Hallo
Mein Problem ist Folgendes:
Ich versuche gerade mit Hilfe von kleinen Sterngrafiken ein Bewertungssystem zu bauen, kennt man ja von Youtube usw.
Sprich wenn man mit dem Mauszeiger über einen Stern fährt soll dieser die Farbe ändern (durch eine dunklere Grafik ersetzt werden). Realiseren wollte ich das Ganze wie in dem Beispiel hier:
http://de.selfhtml.org/javascript/beispiele/buttons.htm
Bei meinen Sterngrafiken handelt es sich um .svg Dateien, die ich mit dem Adobe Illustrator erstellt habe.
Es klappt auch in sofern ganz gut, dass wenn ich mich der Maus über den Stern gehe, die neue (dunklere) Sterngrafik kommt und wenn ich den Stern wieder verlasse wieder die alte kommt.
Nur leider funktioniert es irgendwie nur bei .jpg Dateien diese durch die Sterngrafiken zu ersetzen.
Die .jpg Grafiken haben die Imagebildnummern 0 und 1 und hier klappt auch alles. Wähle ich aber 2 aus, was dann der erste Stern sein müsste passiert garnichts.
Erkennt er die .svg Dateien nicht als Grafiken an?
Achso, die Sterne habe ich sowohl mal mit <object> als auch mit <img> implementiert falls das wichtig ist, ging jedenfalls bei beidem nicht.
Ich hoffe mir kann geholfen werde, danke schomal.
Om nah hoo pez nyeetz, sheiko!
eine gute Idee wäre, die Grafiken als Hintergründe und als Sprites zu verwenden.
Den Hover-Effekt erreichst du dabei durch reines CSS, die dauerhafte Festlegung durch eine Klassenänderung bei onclick.
Es gab hier vor einiger Zeit auch schon mal einen Thread dazu.
Matthias
Vielen Dank schonmal für den link.
Ich hab das Ganze mal mit den Hintergründen wie im link versucht und es funkioniert.
Allerdings wird ja so immernur die Grafik verändert über die ich gerade mit der Maus fahre.
Aber geht es auch, dass gleichzeiti auch die anderen Hintergründe ändere?
Denn ich will ja wenn einer z.B. über den vierten Stern von links fährt, dass alles alle anderen Sterne links davon auch ihren Hintergrund vom hellen zum dunklen Stern änderen.
Nur mit CSS wird das nicht gehen oder?
Om nah hoo pez nyeetz, sheiko!
Aber geht es auch, dass gleichzeiti auch die anderen Hintergründe ändere? Denn ich will ja wenn einer z.B. über den vierten Stern von links fährt, dass alles alle anderen Sterne links davon auch ihren Hintergrund vom hellen zum dunklen Stern änderen.
Nur mit CSS wird das nicht gehen oder?
Pack alle 5 Sterne in eine Grafik. Und zwar als Hintergrundgrafik für ein span-Element.
Matthias