Wie erstelle ich einen RGB-Farbwähler in JS?

Computer: Software & Programmierung JavaScript & Script-Sprachen
#1

Hallo!

Wir haben in der Schule eine Aufgabe bekommen, die wie folgt lautet:

********************************************
RGB-Farbwähler:
Es existieren 3 Eingabefelder (jeweils für Rot, Grün und Blau), die jeweils zwei Hexwerte annehmen können (zb: FF).Stelle für jedes Eingabefeld folgende Buttons zur Verfügung: „+“, „++“, „-“, „–“. Bei Klick auf „+“ soll 1 zum Farbwert addiert werden, bei „++“ 8. Bei den „-“ - Buttons soll subtrahiert werden.
********************************************

Mein Problem bei dieser Aufgabe ist, dass ich nicht weiß, wie man mit den Hexwerten ( RGB - Werten) in Javascript rechnet, um die richtige Farbe zu bekommen.

Ich bitte um Hilfe.

#2

Moin moin,
Javascript rechnet grundsätzlich mit Dezimalwerten. Du solltest also immer den Dezimalwert zu jedem Farbwert speichern und nur bei der Ausgabe mit der Funktion:

r.toString(16)

ausgeben.

Insgeamt für nur ein Kästchen sähe das so aus:

 Title of the document--
 -
 +
 ++


 var r = 0; //in dezimal
 var g = 0;
 var b = 0;

 function redMMinus() {
 r = r - 8;
 document.getElementById("r").value = r.toString(16);
 }
 function redMinus() {
 r = r - 1;
 document.getElementById("r").value = r.toString(16);
 }
 function redPPlus() {
 r = r + 8;
 document.getElementById("r").value = r.toString(16);
 }
 function redPlus() {
 r = r + 1;
 document.getElementById("r").value = r.toString(16);
 }

Ich hoffe ich konnte dir helfen,
beste Grüße,
m_wyspa

#3

Hallo,

das Rechnen mit Hexwerten hat nichts mit Javascript zu tun.

Am einfachsten kannst du dir da selbst helfen, indem du den Windows-Taschenrechner auf „Programmierer“ stellst und dort dann auf HEX. Nun kannst du einfach mal 9 eingeben und dann 1 addieren. Da kommt dann A raus, was ja im Hexadezimalen der dezimalen Zahl 10 entspricht.
So bekommst du evtl. ein leichteres Verständnis für die Berechnung…

Ich hoffe, das hilft dir weiter.

#4

Hallo Markus,
da ich selbst noch nicht viel Erfahrung mit JS habe, kann ich Dir leider nicht weiterhelfen.
Hoffe, jemand anderes kann dies.
Gruß
Erhard

Wir haben in der Schule eine Aufgabe bekommen, die wie folgt
lautet:

********************************************
RGB-Farbwähler:
Es existieren 3 Eingabefelder (jeweils für Rot, Grün und
Blau), die jeweils zwei Hexwerte annehmen können (zb:
FF).Stelle für jedes Eingabefeld folgende Buttons zur
Verfügung: „+“, „++“, „-“, „–“. Bei Klick auf „+“ soll 1 zum
Farbwert addiert werden, bei „++“ 8. Bei den „-“ - Buttons
soll subtrahiert werden.
********************************************

Mein Problem bei dieser Aufgabe ist, dass ich nicht weiß, wie
man mit den Hexwerten ( RGB - Werten) in Javascript rechnet,
um die richtige Farbe zu bekommen.

#5

Wenn man „RGB-Farbwähler in JS“ in google sucht kommt als erster Treffer:

http://de.selfhtml.org/helferlein/farben.htm

Diese Seite enthält ziemlich gut lesbaren Code, den Du als Beispiel nutzen kannst.
Gruß,
Thomas