PDA

View Full Version : Search Textbox like Answers.com



miumiu
02-23-2006, 05:56 PM
Hi,

I am trying to create a search textbox , such that when it is onblur, the textbox will show a bg image, while onfocus, it will be just empty blank bg.
When there is text in the textbox, it will have no bg image when it is onblur.

I am able to do it in this way.

<input name="search" type="text" onblur="this.style.backgroundImage='url(images/random.gif)';this.style.backgroundPosition='center center';this.style.backgroundRepeat = 'no-repeat';" onfocus="this.style.background='yellow'"/>

However, the problem come when there is text in the textbox. When it is onblur, the bg image will be back inside the textbox, which cover up the search term in the text box.

One of the working example is from the answers.com
http://www.answers.com/test
When the textbox is empty, the image of "tell me about..." will be in the text box when it is onblur. However, when there is text in the textbox. the image will not be appear.

How do I check if there is text in the textbox, and prevent it from loading the image when there is?:confused:

Twey
02-23-2006, 06:15 PM
Eh? The "Tell me about" text on answers.com is next to the textbox, not in it.


onblur="if(this.value == '') { this.style.backgroundImage='url(images/random.gif)';this.style.backgroundPosition='center center';this.style.backgroundRepeat = 'no-repeat';}"

miumiu
02-23-2006, 11:21 PM
It is inside the text box actaully.

Anyway, the code works great!
:p

thanks a lot!

Twey
02-24-2006, 04:58 PM
It's not... honestly :p
I had to sample the attachment rather small to make the filesize acceptable to the forum, but you can still make out where the text is in relation to the textbox.