Как реализовать такую форму что на картинке?
Задача: нужно чтобы юзер мог ввести значения для своего будущего номерного знака.
Как мне видится - это создать 8-мь input'ов и прицепить к данной картинке, но мне кажется, есть лучше решения.
У кого какие доводы, опыт в данных формах есть? Какой лучший вариант?
Canvas, если хочется быть уверенным в кроссбраузерности.
Степень геморности примерно такая же.
При правильном программировании можно будет в будущем легко масштабировать форму целиком и тюнить внутренние макро параметры, меняя лишь константы в скрипте.
С другой стороны, вы потеряете всех, у кого отключён JS в браузере (на вашем сайте).
Я бы сделал один input (для основного номера) и собрал шрифт с двумя начертаниями, одно без заливки, а другое с заливкой. И для placeholder задал бы тот который без заливки, а для поля в фокусе с заливкой. И прикрутил бы какой-нибудь jquery.mask, чтобы бред не писали.
На icomoon можно такое сделать. Вам понадобятся все необходимые буквы и цифры от 0 до 9 в svg, в двух вариантах с заливкой и без.
toohappy, тогда все в ваших руках :)
P.S. возможно вам все таки придется сделать свой шрифт, так как у вас в одном инпуте будут буквы и цифры разных размеров, вам надо изначально в сам шрифт заложить цифры больше размером чем буквы, хотя возможно у вас сразу это есть в шрфите
Простой
