Раздел: Java-Скрипты Нет комментариев
placeTo | Кроссбаузерный placeholder для вашего сайта
Предыстория
Недавно верстал сайт, сверстал хорошо, в принципе, но клиент оказался придирчив. Ему нужно было, чтобы для полей ввода показывались подсказки определенного цвета. В современных браузерах подсказки создаются благодаря атрибуту placeholder. Но как было мне поступить со старыми браузерами. В техническом задании, который приложил мне заказчик, был пункт - поддержка IE7+. Вот тут я искал готовые решения, но из всех ничего подходящего для себя не нашел. В итоге я написал скрипт за 20 минут, который реализовывал мою задачу, но, чтобы не создавать такой велосипед, созданный мною, я подумал, а не оформить ли в отдельный проект все это, вдруг кому будет интересно.
Использование
Чтобы долго не расписывать то, что и так есть на сайте документации, я просто расскажу алгоритм:
> Просто добавляем скрипт в область head (body) нашего html-документа, скрипт placeto.js. Да, с учетом, подключенной библиотеки jquery.js
> Для наших инпутов (type='text'), полей ввода прописываем в атрибуте placeholder какое-нибудь значение - это и есть подсказка
> В этом же и инпуте, поле ввода укажите атрибут onfocusout='fout()' - это необходимо для поддержки старых браузеров IE6+, также данный атрибут срабатывает и для остальных браузеров, является ключевым
> Если хотите указать цвет для подсказки пропишите значение в атрибут data-pcolor=" ЗНАЧЕНИЕ ЦВЕТА ", для цвета текста полей ввода применяйте атрибут data-vcolor=" ЗНАЧЕНИЕ ЦВЕТА "
Если из ниже сказанного что-то непонятно, наглядно все указано в документации на сайте placeTo
Документация
Обнаружили ошибку или мёртвую ссылку?
Выделите проблемный фрагмент мышкой и нажмите CTRL+ENTER.
В появившемся окне опишите проблему и отправьте уведомление Администрации ресурса.
Выделите проблемный фрагмент мышкой и нажмите CTRL+ENTER.
В появившемся окне опишите проблему и отправьте уведомление Администрации ресурса.
Нужна органическая вечная ссылка из данной статьи? Постовой?
Подробности здесь
Подробности здесь