Countdown mit Farbverlauf

[hochkant]

Hai,

ich habe einen Countdown der mit JavaScript realisiert wird.
Dieser Countdown zählt natürlich auch eine Zahl sichtbar runter.
Bisher habe ich die Farbveränderung so realisiert das jede Zahl eine entsprechende Zahl hat. (von Grün nach Rot)

Nun möchte ich aber das man den Countdown beliebig verändern kann z.B. 1 min oder 20 sek aber trotzdem die Farbe sich von Grün nach Rot wandelt.

Wie realisiere ich das?
Es muss für jede Zahl eine Hex-Zahl erzeugt werden das ist mir klar aber wie ich die für eine bestimmte Zahl zwischen 0 - $Countdown einem Grün- oder Rotton zuordne ist mir nicht klar.

Beispiel
15 Grün #00FF00
10 #AABB10
0  #FF0000

Ich hoffe das ich mein Problem verständlich geschildert habe und mir jemand helfen kann.

hochkant

[Kalle_B]

Bisher habe ich die Farbveränderung so realisiert das jede Zahl eine entsprechende Zahl hat. (von Grün nach Rot)

Du kannst beliebig viele Farbzahlen in einem Array ablegen. Beim Countdown greifst du dann auf die entspr. Array- Elemente zu.

Kalle

[hochkant]

Du kannst beliebig viele Farbzahlen in einem Array ablegen. Beim Countdown greifst du dann auf die entspr. Array- Elemente zu.

Das habe ich bisher gemacht, aber das ist mir viel zu statisch außerdem funktioniert das nicht mehr.

Noch mal zur Erklärung:
Ich habe einen beliebig langen Countdown von X Sekunden.
Ich möchte das zu beginn das Countdowns (wenn noch viel zeit bleibt) die Zahl grün ist und je mehr Zeit vergeht eine desto rötere Farbe soll erzeugt werden.

Beispiele:
15 - 0
Grün - Rot

30 - 0
Grün - Rot

126 - 0
Grün - Rot

Hoffe das es jetzt ein wenig deutlicher wurde.

hochkant

[Powl]

Hallo,

Du musst bestimmen, wie viele Elemente Dein Countdown hat $lgth.
Dann musst Du die Differenz von Rot zu Grün in $lgth Schritte teilen.
(Da wäre das rgb Modell aber weniger geeignet als HueSaturationValue denke ich)
Mit dem HSV kannst Du die Winkeldifferenz nehmen und dann eben diese variabel ändern. Das kann man dann auch in rgb oder hex umrechenen. Wikipedia hilft.
Dann hättest Du das eigentlich.

netten Tag
^da Powl