Cambiar de una imagen a otra al pasar el ratón por encima

Como su título dice podemos hacer que una imagen tenga el elemeto "Mouseover" El elemento mouseover trata de un efecto en las imagenes que hace al estilo Wordpress que se puede hacer con un código que al pasar el ratón por encima esa imagen cambie de inmediato a otra,puede ser de cualquier medida o dejar la imagen como está para que no se distorcione veamos un ejemplo:

Como se vé la imagen cambia al pasar el cursor puede ser cualquier imagen,OjO no se distorciona solo puse una imagen mas pequeña en el mouseover.

Con enlace vean este ejemplo:

Ahora vamos a los códigos para el elemento mouseover.

Estos son:

Con imagen normal:

<title="Aquí el texto que aparecerá al pasar el ratón por encima"><img src="Aqui imagen normal" onmouseover="this.src='Imagen que aparecera al pasar el ratón';" onmouseout="this.src='Aqui la misma imagen que la primera';" height="(alto)px" with="(ancho)px" />

Con enlace:

<a href="Enlace";' title="Aquí el texto que aparecerá al pasar el ratón por encima"><img src="Aqui imagen normal" onmouseover="this.src='Imagen que aparecera al pasar el ratón';" onmouseout="this.src='Aqui la misma imagen que la primera';" height="(alto)px" with="(ancho)px" />