HTML5 Tutorials und Code-Schnipsel
Wichtig: HTML5 ist immer noch im Entwicklungsstatus, die meisten Browser können mit den neuen Elementen und Attributen wenig anfangen. Mit den aktuellen Versionen von Opera und Chrome bekommt man wenigstens einen kleinen
Vorgeschmack, was in der neuen HTML Version wirklich steckt, auch die
Windows-Version des Safari Browsers unterstützt noch lange nicht alle neuen Funktionen.
Input Type Range mit Datalist - So sieht es zur Zeit noch aus
So könnte ein Range Eingabetype mit Datalist für wichtige Schritte definiert werden
In der Praxis funktioniert Range leider nur mässig, es bleibt zu hoffen, daß eine zeitgemäße Umsetzung bei den einzelnen Browsern erfolgt. Nützlich wäre dieser Eingabetype beispielsweise
bei Suchfunktionen in Online-Shops, um einen Preisbereich einzugrenzen, in dem Produkte gesucht werden.
Wer heute schon einen richtig schicken Slider beispielsweise für Preisbereiche nutzen möchte, könnte auf Javascript ausweichen, jQuery bietet einen hervorragenden
Slider mit großem Funktionsumfang auf Javascript-Basis.
<form>
<input type="range" min="10" max="100" value="55" step="5" name="preis" list="schritte">
<datalist id="schritte">
<option value="10">
<option value="20">
<option value="50">
<option value="100">
</datalist>
</form>
