Hot!Ajax

  • Increase font size
  • Default font size
  • Decrease font size
  • default color
  • black color

Latest News

Gsearch

Google
Home arrow Hodgepodge arrow searchfield(css,js)
searchfield(css,js)
User Rating: / 9
PoorBest 
Sunday, 03 February 2008

Search Field with JS/CSS

Written by Alen Grakalic

It features plug & play onfocus and onblur behaviors and auto suggestion. Search suggestion terms displayed as a dropdown box below the search field. You can navigate with up and down keys, or your mouse and you can edit your own keywords. All you need is two lines of code, links to JavaScript and CSS files and that would be it.

DEMO

download: Searchfield (19.11 kB)

Implementation

  • HEAD:
<p><link href="/searchfield/searchfield.css" rel="stylesheet" type="text/css" 
media="screen" /> 
<script type="text/javascript"   src="/searchfield/searchfield.js"></script> </p>
  
  • BODY:
<p><form id="searchform" action="" method="post"> 
<p><input type="text" id="searchfield" 
name="searchfield" value=""   /> 
<button type="submit">Go</button></p> 
</form> </p>
  

 At the end modify css file to make it blend into your site.

READ MORE

Comments (0)add comment

Write comment

busy
 
< Prev   Next >
[ Back ]