Хоть в HTML5 и есть атрибут placeholder, но он пока-что работает лишь в браузерах с движком webkit.
Посмотрев некоторые посты на хабре, я увидел, что кое-кто изобретал велосипед, а другой скрипт, который якобы и делает сей атрибут кроссбраузерным, в полях типа password показывает звёздочки.
Собственно и написал скромный код на jQuery, который это всё дело и поддерживает.
— Ты вообще о чём?
“Потрогать” можно тут. Обязательно стоит нажать кнопку отправки формы и посмотреть в адресную строку после на отсутствие плейсхолдерного текста.
— А как использовать?
Всё просто:
— Я вижу "$". Нужен jQuery?
Да, конечно. Желательно самый свежий.
— Везде ли работает?
Я проверял в IE7,8; FF3.5; Opera 10.01. Chrome и Safari не требуются в этом скрипте, т.к. понимают атрибут placeholder. (В скрипте предусмотрено это)
— Ну а где скачать?
Здесь.
UPD: все опции (color, className, handle_send, handle_password) — опциональны! В примере лишь показаны их стандартные значения.
UPD2: Есть новая версия: ссылка. Отличается она тем, что нужно лишь вставить скрипт
и в CSS-таблицу занести описание класса placeholded
при этом добавив всем нужным полям атрибут placeholder с нужным текстом. Скрипт по событию DOMReady обойдёт все поля с атрибутом placeholder и применит меры для не-webkit-овских браузеров.
_________________________
Скрипт не мой. Выложен он здесь по-просьбе моего товарища, который пока-что еще не является Хабраюзером. Надеюсь, что кому-либо он пригодится.
Посмотрев некоторые посты на хабре, я увидел, что кое-кто изобретал велосипед, а другой скрипт, который якобы и делает сей атрибут кроссбраузерным, в полях типа password показывает звёздочки.
Собственно и написал скромный код на jQuery, который это всё дело и поддерживает.
— Ты вообще о чём?
“Потрогать” можно тут. Обязательно стоит нажать кнопку отправки формы и посмотреть в адресную строку после на отсутствие плейсхолдерного текста.
— А как использовать?
Всё просто:
options = {
color: '#ccc', //цвет текста placeholder'а
className: 'placeholded', //класс для работы
handle_send: true, //операции с сабмитом.
handle_password: true //издевательство над password-полем
};
$("#myinput").blurfocus('Тест плейсхолдера', options);— Я вижу "$". Нужен jQuery?
Да, конечно. Желательно самый свежий.
— Везде ли работает?
Я проверял в IE7,8; FF3.5; Opera 10.01. Chrome и Safari не требуются в этом скрипте, т.к. понимают атрибут placeholder. (В скрипте предусмотрено это)
— Ну а где скачать?
Здесь.
UPD: все опции (color, className, handle_send, handle_password) — опциональны! В примере лишь показаны их стандартные значения.
UPD2: Есть новая версия: ссылка. Отличается она тем, что нужно лишь вставить скрипт
и в CSS-таблицу занести описание класса placeholded
<style type="text/css">.placeholded {color: #цвет;}</style>при этом добавив всем нужным полям атрибут placeholder с нужным текстом. Скрипт по событию DOMReady обойдёт все поля с атрибутом placeholder и применит меры для не-webkit-овских браузеров.
_________________________
Скрипт не мой. Выложен он здесь по-просьбе моего товарища, который пока-что еще не является Хабраюзером. Надеюсь, что кому-либо он пригодится.
