Xiper

Числа как ползунок

Автор: Евгений Рыжков и Татьяна Головко Дата публикации:
Последнее обновление:

Spinbox, который обсуждался ранее, является не единственным способом указать число. Думаю тебе уже знаком ползунок:

ползунок

Теперь такой ползунок можно сделать простой HTML разметкой. Атрибуты поля выглядят почти так же как и для type="number":

<input type="range"
	min="0"
	max="10"
	step="2"
	value="6">

Доступны те же атрибуты: min, max, step, value. Назначение их то же самое. Отличие будет только в интерфейсе пользователя: вместо текстового поля будет ползунок. На момент написания этой книги Safari, Chrome и Opera уже включили поддержку данного типа. К сожалению iPhone Safari данный тип не понимает, отобразит это поле как текстовое и даже не переведет клавиатуру к числовой. Старые браузеры отобразят обычное текстовое поле.

Куда дальше