Me explico mejor:
Quiero que cuando se pase el cursor sobre el logo, este cambie por otro diferente, pero no cambie de forma brusca, sino poco a poco.
Había pensado en hacer un fade out, sustituir el logo y luego hacer un fade in, con lo que se veia como desaparecía el logo inicial y reaparecía un nuevo logo.
En el ejemplo que he puesto prueba a darle el botón que dice "Run", verás como el CSS cambia, pero no de forma brusca, sino "poco a poco".
Eso es lo que quiero hacer, pero no con anchuras, bordes y demás, sino moviendo la imagen de fondo de 0px 0px a 0px -100px (dejando ver el nuevo logo).
EDITO:
He buscado un poco más por Google y he encontrado un plugin para jQuery que permite hacer animaciones con las posiciones de los fondos.
Lo he aplicado a mi logo y listo, ahora tiene un pequeño efecto al poner el cursor sobre él: parece como si subiese hacia arriba, mostrando el logo-hover en su antigua posición.
El plugin del que hablo es
este, y hay un tutorial sobre cómo aplicarlo en
esta página.