Эффект исчезающего текста в полях ввода

Статус
В этой теме нельзя размещать новые ответы.

seo-partner

Постоялец
Регистрация
12 Янв 2008
Сообщения
356
Реакции
183
4d6697e6760e.jpg

Эффект исчезновения текста
Небольшой, но достаточно приятный эффект для полей ввода информации: поиск, логин и пароль.
Всем привет, хочу поделиться с вами этим небольшим эффектом исчезновения текста при клике например в строке поиска или в полях ввода логина и пароля на вашем сайте.

Я много раз замечал, что многие ставят некие символьные или текстовые значения в полях для ввода инфы на сайте, но при наведении их приходилось вручную обводить и перезаполнять по своему. Посетители моего сайта жаловались на эту проблему и пришлось найти ей решение, которым я хочу пделиться с вами.

На самом деле все очень просто действуте по аналогии с моим примером:

1) Откройте main.tpl и отищите там примерно такие строки:

<input name="story" type="text" style="width:280px; height:16px; font-family:verdana; color:#333333; font-size:13px;border:1px solid #A1B1BE;" value="GTA 4" />

У вас они будут отличаться от моих, но суть думаю ясна. У меня текстом по умолчанию уже стояло значение GTA 4

2) Дополните этот код следующими значеними:

onblur="if(this.value=='') this.value='GTA 4';" onfocus="if(this.value=='GTA 4') this.value='';" type="text"/>


У вас должен получиться примерно следующий код поиска:

<input name="story" type="text" style="width:280px; height:16px; font-family:verdana; color:#333333; font-size:13px;border:1px solid #A1B1BE;" value="GTA 4" type="text" />

где GTA 4 будет вашим вариантом текста поиска... опять же, ничего сложного тут нет.

3) Сохраняем и отправляем main.tpl на сервер... после чего проверяем получившийся в итоге эффект!

Внимание! Dreamweaver, отметил повторяющееся значение GTA 4

onblur="if(this.value=='') this.value='GTA 4';
как ошибочное, при желании можно убрать повтор, а можно и оставить. Такое величайшее ЗЛО как IE реагирует и выводит данный эффект очень корректно и без каких-либо проблем!
 
на скок я вижу это применимо для дле(так как маин.тпл ток там встречял)
а для дугих движков или скриптов просто вставляем вместо простого импута
<input name="story" type="text" value="ваше_значение" onblur="if(this.value=='') this.value='ваше_значение'" onfocus="if(this.value=='ваше_значение') this.value='' " />
 
Статус
В этой теме нельзя размещать новые ответы.
Назад
Сверху