2
Contributors
3
Replies
4
Views
5 Years
Discussion Span
Last Post by davy_yg
0

Jquery has not much to do with it. It is just a form, and the input box has some elaborate CSS styling. Inspect the source for details.

0

Almost done with the search box. Now, how to leave the word "Search" in the search box that I have made by default (without having to type it) ?

style.css

#searchwrapper {
width:310px; /*follow your image's size*/
height:40px;/*follow your image's size*/
background-image:url(Images/search box.jpg);
background-repeat:no-repeat; /*important*/
padding:0px;
margin:-30px;
position:relative; /*important*/
left:800px;
}
 
#searchwrapper form { display:inline ; }
 
.searchbox {
border:0px; /*important*/
background-color:transparent; /*important*/
position:absolute; /*important*/
top:5px;
left:20px;
width:146px;
height:28px;
font:arial;
font-style:italic;
color:white;
}
 
.searchbox_submit {
border:0px; /*important*/
background-color:transparent; /*important*/
position:absolute; /*important*/
top:3px;
left:163px;
width:30px;
height:25px;
}

index.html

<div id="searchwrapper"><form action="">
<input type="text" class="searchbox" name="s" value="" />
<input type="image" src="Images/submit2.jpg" class="searchbox_submit" value="" />
</form></div>

I mean if I place the cusor outside the search box and click it the text appears and if I am ready to type in something inside the search box the text disappears. How to do so ?

Just like this website:

http://www.ferron-pharma.com/?q=en

Edited by davy_yg: n/a

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.