Verständnisproblem bei der Funktionsweise von <meter>

[Matthias Apsel]

Hallo Auge,

Es gibt immer nur 3 Intervalle, nicht 5, die beachtet werden.

Wenn ich dich richtig verstehe, gibt es maximal drei Bereiche (egal, in welcher Farbe die schlussendlich dargestellt werden).

Ja.

Wenn ich meinen Code nun auf folgendes beschränke, um einen grünen Bereich (der mit dem angegebenen Optimum), einen in gelb (high bis max) und einen in rot (value > max) zu erhalten, funktioniert der grüne und gelbe Bereich, aber oberhalb von max wird dennoch nicht auf rot umgeschaltet

   <meter id="progress-bar" min="0" optimum="139" high="150" max="160" value=""></meter>

Irgendwo — entweder bei mir oder in meinem Browser (Firefox 51.0.1) — hakt's immer noch.

bei dir. 😉

Die Intervalle sind keine Intervalle einer Intervallschachtung wie etwa

• $$ {]- \infty,\infty[} $$ // rot
• $$ [min,max] $$ // gelb
• $$ [low,high] $$ //grün

sondern

• $$ [min,low[ $$ // rot
• $$ [low,high] $$ // gelb
• $$ ]high,max] $$ // grün

für den Fall dass kein optimum definiert ist. Ob die Art der Intervallgrenzen spezifikationsgemäß ist, weiß ich nicht.

Wenn es ein Optimum gibt, wird es grün dargestellt, das oder die benachbarte(n) Intervall(e) gelb und ggf. das nicht benachbarte Intervall rot.

In deinem Fall also von 0 bis 150 grün, von 150 bis 160 gelb. Alles andere liegt außerhalb des Definitionsbereiches und wird nicht berücksichtigt.

Allerdings sehe ich durchaus deinen Anwendungsfall. Vielleicht gibts da schon issues in der Dokumentation?

Bis demnächst
Matthias