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

Тема в разделе "Веб-дизайн", создана пользователем seo-partner, 6 окт 2008.

Статус темы:
Закрыта.
Модераторы: zek24
  1. seo-partner

    seo-partner

    Регистр.:
    12 янв 2008
    Сообщения:
    195
    Симпатии:
    139
    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 реагирует и выводит данный эффект очень корректно и без каких-либо проблем!
     
  2. bumbu

    bumbu

    Регистр.:
    17 окт 2007
    Сообщения:
    233
    Симпатии:
    28
    на скок я вижу это применимо для дле(так как маин.тпл ток там встречял)
    а для дугих движков или скриптов просто вставляем вместо простого импута
    <input name="story" type="text" value="ваше_значение" onblur="if(this.value=='') this.value='ваше_значение'" onfocus="if(this.value=='ваше_значение') this.value='' " />
     
Статус темы:
Закрыта.