Input con translacion

[phyronx]

Buenas, tengo el siguiente codigo, en plan demo:

Código HTML:

<style type="text/css">
 
.textbox_normal { background-color:#FFFFFF; width: 100px;}
.textbox_activado { background-color:#FFFFCC;color:#0000FF width: 200px;}
 
</style>
 
<p>
 
<input type="text" name="caja" size="30" maxlength="40" class="textbox_normal" onFocus="this.className='textbox_activado'" onblur="this.className='textbox_normal'"></p>
 

Necesito que al cambiar el input de tamño lo haga pero con una translacion, no de golpe, y no tengo ni idea de como hacerlo.