:focus | mit ohne Anker
Habe da etwas gefunden und möchte es Euch nicht vorenthalten ;)
Dynamische Pseudoklassen und benannte Anker (Ein lob auf den Autor: Klaus Langenberg) Was man mit :focus und Ankern doch so alles anstellen kann, aber schaut selbst indem Ihr das TEST-Case kopiert und auf die Links klickt. Natürlich möchte ich eine Cross-Browser Test IE => geht es nicht (logisch) FF 1.07 => perfekt Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
Was genau meinst du denn jetzt?
In dem CSS Definierst du ja hauptsächlich Hintergrundfarben, aber ich merke bei einem hover nur den Farbenwechsel (von blau nach gelb), bei einem :focus, sprich klick drauf ändert sich die Schriftfarbe nach rot (ist afaik ein Firefox-Standard) Auch wenn ich alle Links auf "unbesucht" stelle (Webdeveloper-Bar) sehe ich die Türkise Hintergrundfarbe nie (a:focus{background:#00CCCC;}). Benutze Firefox 1.5 Bitte stell nochmal dar, was du jetzt so tolles gefunden hast ;) |
Zitat:
Worum es mir geht ist dass beim aktivieren der Links der Inhalt der Ziel-Anker per Event(:focus) aufbereitet werden kann, in meinem Beispiel mit einer Hintergrundfarbe über den gesamten Absatz. Falls Du keine Hintergrundfarbe (Änderung) beim FF 1.5 erhälst ist der Browser nicht Standardgerecht :? |
Zitat:
Zitat:
edit: @ulle: schöner Effekt. Ich mach jetzt mal einen Mac-Test... |
Mac-Test... :shock: (laß das lieber)
Du nimmst den Safari 2.02 ;) |
Zitat:
Aber was schlimmer ist: FF 1.5RC2 kann's auch nicht! :shock: [@theDoc: ich wundere mich also ;)] Der 1.0.7 tut's noch - alles Mac OSX. |
Deshalb hatte ich auch nochmal nachgefragt, ich hatte mir ja extra den CSS-Code angeguckt und bin alle Farben durchgegangen...
Sehr merkwürdig, dass RC2 das nicht mehr kann, meldet das jemand mal @ bugzilla? |
Zitat:
Wenn man zu Grunde legt dass nur Elemente fokusierbar, also somit auch für den Event-Handle (onfocus) nutzbar, sind die auch eine Aktion ausführen konnen, so zum Beispiel Verweise, Textfelder oder Druckknöpfe (Button), dann ist das Verhalten wohl richtig. Im FF 1.07 läßt sich der Anker (Ziel) ja auch nicht mit TABs fokusieren. Leider schade, und ich dachte es wäre eine schöne Möglichkeit andere ("unabhängige") Elemente innerhalb der WEBpage Ereignis bezogen zu Steuern. Was bleibt: Eine schöner Ansatz/Lösungsweg zum Eingangs erwähnten Thema, die Trennung von Anker und Verweis per selector ohne class oder #id. Und das Verständnis zur Link-Pseudoklassen und Dynamische Pseudoklassen ;) |
Da ja meine 'schlauer' :focus Trick nur eine Halbwertszeit bis zum FF 1.5 besitzt muß eine andere Lösung her, natütlich ohne JavaScript.
Da ich ja oben das Ankerziel mit einem Event beeindrucken wollte, und dieses Verlangen wohl auch schon andere umtrieb, hat das W3C schon vorgedacht - siehe CSS 3 :P Ziel => target (engl.) The target pseudo-class :target Zitat:
Übrigens funktioniert :target nicht nur mit Ankern, es lassen sich auch andere Elemente mit ID verändern. So zumindest meine ersten Tests. _____________ FF 1.07 kann die Pseudo-Class deklarieren/umsetzen. Ich hoffe der FF 1.5 auch. Code:
/* change */ |
Funktioniert auch in der letzten RC (#3, die wird wahrscheinlich auch die final sein).
Danke Ulle, werd ich sicher mal verwenden, weiß jemand ob Opera das unterstützt? Oder Safari 2 ? |
Alle Zeitangaben in WEZ +2. Es ist jetzt 14:26 Uhr. |
Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.
© Dirk H. 2003 - 2023