webページに検索窓を設置する際、デザイン的な問題やスペース的に難しいことがあります。そんなとき、フォーカス時に検索窓のサイズ変更させる、というのも手法の一つとしてありかと思います。jQueryのanimateを使って、簡単かつ見た目にも好印象な検索窓を実装できます。

検索窓にフォーカスすると横サイズをanimate効果を使って変更します。フォーカスを外す（他をクリック）と元に戻ります。