Saludos, espero que esto te sirva.
Esto se pondria en el css externo o en el head con las etiquetas style en la etiqueta a donde pone 25px tendrás que poner la medida en grande de tu imagen y esta se reducirá al 50% hasta que te pongas encima que crecerá al 100%:
Código:
<style type="text/css">
a { display: block; height: 25px; width: 25px; text-align:center; line-height: 25px; }
img { width: 50%; }
img:hover { width:100%; }
</style>
y la imagen como la tienes:
Código:
<a href="#"><img src="..." /></a>
Ya contaras si te funciona, saludos.