how i can make jquery top box like stackoverflow.com

Answer 1

They are doing 2 things:

1) They have a background image which is why the little magnifying glass appears:

#hsearch .textbox {
    background:url("http://sstatic.net/so/Img/search.png") no-repeat scroll left center #FFFFFF;
    border-color:#CCCCCC -moz-use-text-color -moz-use-text-color #CCCCCC;
    border-right:medium none;
    border-style:solid none none solid;
    border-width:1px medium medium 1px;
    margin:0;
    max-width:230px;
    padding-left:16px;
}

2) When you click on the box, if the content says "search", then it's blanked out. This is done by simple javascript:

<input name="q" class="textbox" tabindex="1" 
    onfocus="if (this.value=='search') this.value = ''" 
    type="text" maxlength="80" size="28" value="search"> 

Answer 2

You mean like on the front page of this site ?

(It'd be a lot more helpful if you were specific.)

In my case I used the activebar plugin