Slider
Ein Wert oder ein Bereich auf einer 6-px-Schiene mit 44-px-Trefferfläche. Pfeiltasten, Bild auf/ab sowie Home/End folgen der Base-UI-Tastatur; die Wert-Bubble zeigt den aktuellen Wert auf Wunsch beim Ziehen oder dauerhaft.
Wert, Marken und Bubble
Die Schiene ist 6 px hoch, die Trefferfläche 44 px. Marken sitzen unter der Schiene; showValue blendet eine Wert-Bubble über dem Thumb ein.
Bereich
Ein Array-Wert aktiviert zwei Thumbs. Sie können sich nicht überholen; der Formatierer gilt für Bubble und Vorlesetext.
Gewählt: [8,32]
Deaktiviert und im Field
Deaktivierte Slider bleiben sichtbar, reagieren aber nicht. Im Field verknüpft der Slider Beschreibung und Fehler automatisch.
Zwischen 0 und 40 Stunden.
Playground
Wert-Bubble und Zustand umschalten.
Barrierefreiheit
Der Slider ist ein Range-Input mit aria-valuenow, aria-valuemin, aria-valuemax und aria-valuetext. Pfeiltasten ändern den Wert um einen Schritt, Bild auf/ab um zehn, Home/End springen an die Grenzen. onValueCommit feuert erst nach dem Loslassen.
Für Budgets und Filter lohnt sich der Bereichsmodus mit sichtbaren Grenzen; für untergeordnete Einstellungen reicht ein Einzelwert ohne Bubble.