Am Anfang des Design steht eine Linie...   webdesign » Javascript Tipps » Farbwähler

Mit Javascript lassen sich praktische Tools wie dieser Farbwähler programmieren. Per Mouseover können Sie stufenlos die Farbwerte regulieren, ein Klick setzt den Maximal bzw. Minimalwert. Die Darstellung der Farbe erfolgt im Bereich rechts neben den Eingabefeldern.

  Mehr Rot Weniger Rot Farbanzeige
  Mehr Grün Weniger Grün
  Mehr Blau Weniger Blau
  Hex  

Das Programm arbeit vergleichsweise einfach. Per Mouseover werden die Dezimalwerte für Rot, Grün und Blau, also jener Farben die zur additiven Farbmischung dienen, erhöht oder erniedrigt. Da nicht alle Browser in der Lage sind, CSS-Angaben mit solchen RGB-Werten darzustellen, erfolgt anschließend eine Umrechnung in Hexadezimalwerte. Die Ausgabe erfolgt per Zugriff auf die CSS-Eigenschaften der Tabellenzelle. Da Netscape 4x das nicht erlaubt, erfolgt die Ausgabe hier mittels eines Div-Layers, der ensprechend positioniert wurde.

Die Umrechnung von Dezimal in Hexadetimal erfolgt mit der Methode toString() Als Parameter kann man die Basis des gewünschten Zahlensystems - hier 16 für Hexadezimal - angeben. Um eine Fehlinterpretation durch Vermischung von ein und zweistelligen Werten zu vermeiden muß bei einem einstelligen Ergebnis gegebenenfalls eine 0 voranfestellt werden.

Bei dem downloadbaren Beispielscript wurde die Anzeige der Farbe auf eine Div-Layer beschränkt. Die Referenzierung erfolgt mittels der Funktion dRef(), die eine browsergerechte Referenzierung zurückliefert. Die Hintergrundfarbe wird im NC 4x abweichend mit bgColor angesprochen, die browserspezifische Syntax wird daher über eine verkürzte if-Abfrage in der Variablen bgC gespeichert.

Beispiel downloaden

digitales tagebuch von kamera grafik design
home
kamera
grafikdesign
webdesign
kgde
kamera
CAD/CAM Mäuse
Nymphenburg
Digitales Tagebuch
Filme
grafikdesign
Städtetheater
Flyer Technik-Camps
Illustration
Broschüren & Folder
webdesign
Referenzen
Javascript Tipps
kgde
Kontakt & Impressum
Technische Hinweise