0
Сообщений в теме: 8
#1
Отправлено 02 Октябрь 2015 - 09:00
Есть ли возможность в мобильной версии сайта для блоков, где нужно вносить только цифры (номер телефона, количество товаров, номер квартиры, индекс и прочие) сделать вывод цифровой клавиатуры.
То есть, когда вы на своём смартфоне на платформе Android/iOS/WP нажимаете на поле ввода индекса или номера телефона, то вам выводят клавиатуру следующего типа:
или или
Лично по себе замечал, что сайты и приложения, которые требуют ввести цифры, и при этом выводят сразу клавиатуры с цифрами - мне они очень нравятся и Я их неосознанно запоминаю (они облегчают жизнь, так сказать=)).
Модераторы, каким образом осуществить вывод данной клавиатуры на мобильной версии сайта для блока ввода телефона (к примеру).
Спасибо.
То есть, когда вы на своём смартфоне на платформе Android/iOS/WP нажимаете на поле ввода индекса или номера телефона, то вам выводят клавиатуру следующего типа:
или или
Лично по себе замечал, что сайты и приложения, которые требуют ввести цифры, и при этом выводят сразу клавиатуры с цифрами - мне они очень нравятся и Я их неосознанно запоминаю (они облегчают жизнь, так сказать=)).
Модераторы, каким образом осуществить вывод данной клавиатуры на мобильной версии сайта для блока ввода телефона (к примеру).
Спасибо.
#2
Отправлено 03 Октябрь 2015 - 15:07
Прошу прощения, данная клава работает на сайте, но только не на всех блоках. При вводе количества товаров, индекса почтового всё норм, Я даже рад очень.
Единственное - при вводе номера телефона буквенная клавиатура выползает, цифровая почему-то не хочет сразу.
Что поменять можно в классе ввода (или как это называется), чтобы и при вводе телефона была цифровая клава.
Единственное - при вводе номера телефона буквенная клавиатура выползает, цифровая почему-то не хочет сразу.
Что поменять можно в классе ввода (или как это называется), чтобы и при вводе телефона была цифровая клава.
#3
Отправлено 07 Октябрь 2015 - 01:23
Так как же сделать, чтобы в мобильной версии сайта при вводе номера телефона выводилась сразу цифровая клавиатура?
#4
Отправлено 27 Октябрь 2015 - 05:00
В шаблоне Быстрый заказ найдите:
замените на:
Проверьте работу данного поля для ввода телефона в устройстве.
<input placeholder="Для оперативной связи с вами и согласования заказа" id="sites_client_phone" name="form[contact][phone]" value="{ORDER_FORM_CONTACT_PHONE}" maxlength="255" class="required input-text" type="text"/>
замените на:
<input placeholder="Для оперативной связи с вами и согласования заказа" id="sites_client_phone" name="form[contact][phone]" value="{ORDER_FORM_CONTACT_PHONE}" maxlength="255" class="required input-text" type="tel"/>
Проверьте работу данного поля для ввода телефона в устройстве.
#5
Отправлено 30 Октябрь 2015 - 22:10
Vaccina (27 Октябрь 2015 - 05:00) писал:
В шаблоне Быстрый заказ найдите:
замените на:
Проверьте работу данного поля для ввода телефона в устройстве.
<input placeholder="Для оперативной связи с вами и согласования заказа" id="sites_client_phone" name="form[contact][phone]" value="{ORDER_FORM_CONTACT_PHONE}" maxlength="255" class="required input-text" type="text"/>
замените на:
<input placeholder="Для оперативной связи с вами и согласования заказа" id="sites_client_phone" name="form[contact][phone]" value="{ORDER_FORM_CONTACT_PHONE}" maxlength="255" class="required input-text" type="tel"/>
Проверьте работу данного поля для ввода телефона в устройстве.
С телефона всё прекрасно работает, только и в версии для ПК поле изменилось (длинна и вид - закругления на углах добавились).
Есть ли возможность сделать версию для ПК с обычным полем и версию для мобильных с полем как получилось сейчас?
И спасибо за ответ - очень удобно со смартфона вводить.
#6
Отправлено 31 Октябрь 2015 - 02:17
Из-за изменения типа поля некоторые стили слетели, в main.css найдите:
замените на:
#quickform input[type="text"], #quickform input[type="number"], #quickform input[type=phone], #quickform input[type=email], #quickform input[type=password] { width: 96%; height: 30px; border: 1px solid gray; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; text-align: left; }
замените на:
#quickform input[type="text"], #quickform input[type="tel"], #quickform input[type="number"], #quickform input[type=phone], #quickform input[type=email], #quickform input[type=password] { width: 96%; height: 30px; border: 1px solid gray; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; text-align: left; }
#7
Отправлено 02 Ноябрь 2015 - 16:17
Vaccina (31 Октябрь 2015 - 02:17) писал:
Из-за изменения типа поля некоторые стили слетели, в main.css найдите:
замените на:
#quickform input[type="text"], #quickform input[type="number"], #quickform input[type=phone], #quickform input[type=email], #quickform input[type=password] { width: 96%; height: 30px; border: 1px solid gray; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; text-align: left; }
замените на:
#quickform input[type="text"], #quickform input[type="tel"], #quickform input[type="number"], #quickform input[type=phone], #quickform input[type=email], #quickform input[type=password] { width: 96%; height: 30px; border: 1px solid gray; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; text-align: left; }
Эврика! Всё отлично в версии для ПК.
А ещё небольшой вопрос: можно ли поменять в мобильной версии сайта размер поля ввода номера телефона, чтобы оно выглядело таким же по длине, как и поле для имени и e-maila? А то оно сейчас уже и короче, не вписывается в общий стиль, так сказать...
#8
Отправлено 02 Ноябрь 2015 - 16:46
like.hornet.6 (02 Ноябрь 2015 - 16:17) писал:
Эврика! Всё отлично в версии для ПК.
А ещё небольшой вопрос: можно ли поменять в мобильной версии сайта размер поля ввода номера телефона, чтобы оно выглядело таким же по длине, как и поле для имени и e-maila? А то оно сейчас уже и короче, не вписывается в общий стиль, так сказать...
А ещё небольшой вопрос: можно ли поменять в мобильной версии сайта размер поля ввода номера телефона, чтобы оно выглядело таким же по длине, как и поле для имени и e-maila? А то оно сейчас уже и короче, не вписывается в общий стиль, так сказать...
В main.css найдите код
#content #sites_client_mail, #content #sites_client_pass, #content #reg_name { min-height: 30px; width: 94%; }и замените на
#content #sites_client_mail, #content #sites_client_pass, #content #reg_name { min-height: 30px; width: 96%; }
#9
Отправлено 03 Ноябрь 2015 - 14:40
Danil (02 Ноябрь 2015 - 16:46) писал:
Здравствуйте.
В main.css найдите код
В main.css найдите код
#content #sites_client_mail, #content #sites_client_pass, #content #reg_name { min-height: 30px; width: 94%; }и замените на
#content #sites_client_mail, #content #sites_client_pass, #content #reg_name { min-height: 30px; width: 96%; }
Теперь выглядит потрясающе!
Темы с аналогичным тегами мобильная, версия, клавиатура
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных