Safariっぽい検索フォームを作るJavaScript「jQuery Safari Searcher」

appleのデザインっていいですよね。
サイトでも使いたいですよね。
jQueryプラグインjQuery Safari Searcherを使用すると検索フォームをSafariっぽくできます。

sponsors

使用方法

jQuery Safari Searcherからファイル一式をダウンロードします。

<link type="text/css" rel="stylesheet" href="j-searcher.css" />
<!--[if lt IE 8]><link rel="stylesheet" href="j-searcher.ie.css" type="text/css" media="screen"><![endif]-->
<!--[if IE 6]><link rel="stylesheet" href="j-searcher.ie6.css" type="text/css" media="screen"><![endif]-->
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.dependClass.js"></script>
<script type="text/javascript" src="templating.js"></script>
<script type="text/javascript" src="inheritance.js"></script>
<script type="text/javascript" src="jquery.searcher.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$("#id名").searcher();
});
</script>
あとは以下のようにid名を記載すれば完成です。
<input id="id名" type="search" placeholder="Search" autocomplete="off" />

サンプル


Javascriptサンプルページ一覧
skuare.net