I want to share my jQuery search box plugin looks like Safari one. It is really easy to customize skin by drawing new sprite. Moreover, it have all the same functionality as a real one and a bit more — incremental search with loader. I hope it would help to you guys. Below some demos and examples of usage.

Simple search:

<div style="width: 200px"> <!-- ← Define searcher width by setting width to parent node.-->
  <input id="SimpleSearcher"
    type="search"
    placeholder="Search"
    autocomplete="off"
  />
</div>
<script type="text/javascript" charset="utf-8">
  $("#SimpleSearcher").searcher();
</script>

Incremental search:

<div style="width: 200px">
  <input id="IncrementalSearcher"
    type="search"
    placeholder="Search"
    autocomplete="off"
 
    incremental="yes"
    onsearch="onSearchHandler.apply(this, arguments)"
 
  />
</div>
<script type="text/javascript" charset="utf-8">
  $("#IncrementalSearcher").searcher();
  function onSearchHandler(){
    this.loading(true);
    /* AJAX or simple JavaScript actions */
  }
</script>

Getting Search Object

<script type="text/javascript" charset="utf-8">
  $("#IncrementalSearcher").data("SearchHandler").onsearch = function(){ /* whatever */ };
</script>