Цель поста: поделиться с разработчиками решением использования кроссбраузерного input type=«number» или узнать о более лучших решениях.

Недавно столкнулся с необходимостью использования кроссбраузерного input type=«number». Как известно данный тип input`a во всех браузерах выглядит по разному, если вообще поддерживается, а если и поддерживается, то практически не поддается оформлению с помощью css. Никаких толковых решений по данной теме, я найти не смог, поэтому и написал свое, которое оформил в виде мини-плагина. На данный момент ему передается только один параметр — это селектор, к которому применяется js код:

jQuery(function ($) {
	$('input[type=number]').iLightInputNumber();
});

Для примера возьмем три input`a с разными атрибутами:

<input type="number" step="100" min="0" class="" placeholder="Your budget"><br/>
<input type="number" min="1" class="" placeholder="1"><br/>
<input type="number" min="1" class="" value="1">

Рабочий пример.

Проверено: opera, chrome, ff, ie9+

Читать дальше →