Красивая и динамичная форма поиска

[Belovsan]

Столкнулся с задачкой. Ищу уже целый день, а толком так ничего и не смог найти. В общем, надо сделать форму поиска, но не простую. Значит когда курсор ещё в окне поиска не вставлен, там должна быть надпись "Введите данные для поиска" и плюс ещё в самом начале строки будет стоять картинка (типа иконка маленькая). Затем, когда вставляю в окно поиска курсор, всё это должно исчезнуть (и надпись и иконка) и остаться только чистое поле для введения поисковых данных. Вот такая "радость" подвалила. Может кто встречал решение такой задачки? Или у кого-нибудь она есть? Буду очень признателен за помощь.

[psywalker]

JS тебе в помощь.

[s0rr0w]

Такие "сложные" скрипты нормальные верстальщики с закрытыми глазами пишут.

[Belovsan]

Такие "сложные" скрипты нормальные верстальщики с закрытыми глазами пишут.

К сожалению пока я и CSS толком не знаю. Если сейчас в скрипты уйду, то наверное сума сойду. Точно сойду

Но это... я не жалуюсь. Всё норм.

Edited August 4, 2010 by Belovsan

[npofopr]

<input type="text" value="Адрес электронной почты" name="Email" onblur="if(this.value == '') this.value = 'Адрес электронной почты';" onfocus="if(this.value == 'Адрес электронной почты') this.value = '';" class="long">

ну вот хотя бы так будет текст.

[Belovsan]

<input type="text" value="Адрес электронной почты" name="Email" onblur="if(this.value == '') this.value = 'Адрес электронной почты';" onfocus="if(this.value == 'Адрес электронной почты') this.value = '';" class="long">

ну вот хотя бы так будет текст.

Спасибо. Я кстати такой вариант тоже уже нашёл. Думаю как раз над тем а можно ли туда как-то и картинку эту маленькую прикрутить.

Нда, а с картинкой засада, блин Не, с картинкой точно не смогу сделать. К value её никак не прикрутить. А когда делаю бэкграундом, то она при размещении курсора в окне понятное дело никуда не исчезнет.

Edited August 4, 2010 by Belovsan

[s0rr0w]

Спасибо. Я кстати такой вариант тоже уже нашёл. Думаю как раз над тем а можно ли туда как-то и картинку эту маленькую прикрутить.

Нда, а с картинкой засада, блин Не, с картинкой точно не смогу сделать. К value её никак не прикрутить. А когда делаю бэкграундом, то она при размещении курсора в окне понятное дело никуда не исчезнет.

Класс должен описать картинку. Присвоил класс - есть картинка. Убрал класс - нет картинки.

[Belovsan]

Класс должен описать картинку. Присвоил класс - есть картинка. Убрал класс - нет картинки.

Вот что имеем:

<input type="text" class="login" onfocus="if(this.value!='') this.value=''" onblur="if(this.value=='') this.value='Введите данные для поиска'" value="Введите данные для поиска" />

Но ведь здесь имеем текстовое поле, которому присвоен класс. В классе бэкграундом висит эта картинка. Каким образом я могу у него убрать класс и задать новое условие?

Кстати, нашёл решение с помощью задания в стилях бекграунда для параметра INPUT.login:focus (только он не работает в ИЕ6,7). А вот относительно Вашей подсказки правда не понял как можно это реализовать.

Edited August 4, 2010 by Belovsan

[mishka]

<input type="text" value="Адрес электронной почты" name="Email" onblur="if(this.value == '') this.value = 'Адрес электронной почты'; className = className.replace('focus', '')" onfocus="if(this.value == 'Адрес электронной почты') this.value = '';className += ' focus'" class="long">

[Belovsan]

<input type="text" value="Адрес электронной почты" name="Email" onblur="if(this.value == '') this.value = 'Адрес электронной почты'; className = className.replace('focus', '')" onfocus="if(this.value == 'Адрес электронной почты') this.value = '';className += ' focus'" class="long">

Спасибо за помощь. Пожалуй верстальщик без знаний джавы - это наполовину верстальщик.

Блин, сколько всего надо знать. А как ни зайду на СЕО форумы, так все пишут типа верстальщик - это самый низкоквалифицированный специалист. Дискриминация, ёкть!

Edited August 5, 2010 by Belovsan

[s0rr0w]

Спасибо за помощь. Пожалуй верстальщик без знаний джавы - это наполовину верстальщик.

Блин, сколько всего надо знать. А как ни зайду на СЕО форумы, так все пишут типа верстальщик - это самый низкоквалифицированный специалист. Дискриминация, ёкть!

Не называйте JavaScript джавой. Это показывает вашу полнейшую некомпетентность.

[Belovsan]

Не называйте JavaScript джавой. Это показывает вашу полнейшую некомпетентность.

Ок. Хотя... можно ж ещё js. Так какг бэ меньше букв и компетентно. Правда же?

Я понял, суть в самом слове "джава" или "жава". Ясн.

Спасибо, что поправили

Edited August 5, 2010 by Belovsan

[s0rr0w]

Ок. Хотя... можно ж ещё js. Так какг бэ меньше букв и компетентно. Правда же?

Я понял, суть в самом слове "джава" или "жава". Ясн.

Спасибо, что поправили

Сама суть в слове Script, которое стоит сразу после слова Java

[Belovsan]

Сама суть в слове Script, которое стоит сразу после слова Java

Понял.

Edited August 5, 2010 by Belovsan