$('input').focus(function(){ t = $(this); if(t.val()==='foo bar'){t.val(''); }t.animate({width: '250px'},400); }); $('input').blur(function(){ t = $(this); if(t.val()===''){t.val('foo bar'); }t.animate({width: '140px'},500); });
input{margin:50px;width:140px;}
<input type="search" value="foo bar">