Kundenmenue

Ermitteln von user-definierten Farben und Bildern von Alexander Farkas

Dieses Script ermöglicht die Überprüfung einiger Usereinstellungen (Bilder anzeigen, Eigene Farben (auch bekannt als user mode, Benutzermodus, contrast mode), um mit diesen Zusatzinformationen zugänglichere DHMTL/DOM-Scripting-Widgets & CSS-Techniken zu realisieren. Dies soll an einer Image Replacement Methode demonstriert werden.

Direkt zur Einbauanleitung und zum Download des Scripts springen

Image Replacement Porbleme und Lösungen

Nicht zugänglich für SR-User bei Verwendung von display:none. (Lösung: u.a. Phark-Mehtode)
Berücksichtigt keine Text-Vergrösserung. (Lösung: Text-Resize Detection auch als jQuery-Plugin)
Image Replacement Techniken berücksichtigen keine Farbschemata (Priorität I der BITV!) und keine ausgeschalteten Bilder. Ausführlich zu ersterem: Image Replacement-Techniken nicht zugänglich für Sehbehinderte. Lösung: dieses Script

Demonstration:

Alte Phark-Methode:

Überschrift

Phark-Methode (mit Text-Resize, Picture-Off- und Kontrast-Mode-Detection):

Überschrift

Das CSS vom obigen Beispiel geht davon aus, dass Bilder und Autoren-Modus (nicht Benutzer-Modus!) aktiviert ist, wenn JavaScript deaktiviert wurde. Man kann wie unteres Beispiel zeigt, auch umgekehrt vom worst-Case ausgehen, auch wenn eine solche Situation in der Praxis gar nicht auftauchen wird und User mit ausgeschaltetem JavaScript ein schlechteres Design bekommen....

CSS-Nutzung
- Bilder sind an aus
- User verwendet eigene Farben User verwendet Autorenfarben
JavaScript-Nutzung
- Was wird genutzt?

Benutzung

Script-Auruf (jQuery):

$.authorUserMode({option:'optionname'});

Script-Auruf (normale lightweight Variante):

authorUserMode({option:'optionname'});

Optionen/Parameter für das Script:

except_safari: (boolean) true nimmt den Safari-Browser aus der Autoren/Benutzer-Modus-Test raus (default: false; behandelt also Safari wie jeden anderen Browser auch)
pictureurl: (string) Pfad zu einem Testbild (default: false; es wird nicht überprüft, ob Bilder anzeigen ein oder ausgeschaltet ist).
picturewidth: (number) Breite des Testbildes (default: 1)

Ergebnis:

Ist CSS aktiviert, fügt das Script dem body-Element 'cssenabeld' als CSS-Klasse hinzu und entfernt eine evtl. vorhandene Klasse namens 'cssdisabeld'.
Ist Autorenmodus aktiviert, fügt das Script dem body-Element 'authorbg' als CSS-Klasse hinzu und entfernt eine evtl. vorhandene Klasse namens 'userbg'.
Sind Bilder aktiviert, fügt das Script dem body-Element 'pictureenabeld' als CSS-Klasse hinzu und entfernt eine evtl. vorhandene Klasse namens 'picturedisabeld'.
umgekehrt -> umgekehrt :)

Download

Autoren-/Benutzer-Modus, Picture-Off, CSS-Off Detection-jQuery Plugin
Autoren-/Benutzer-Modus CSS-Off, Picture-Off, CSS-Off Detection-Script (benötigt kein framework, nutzt einige Helper-Methoden von prototype, welche gelöscht werden können, wenn Ihr mit prototype arbeitet.)

Links

. top