If you want to change image after user click on image or button then read: alternate image after onclik event.
In this demo when you move mouse over image the arrow change side. It is achieved with changing src property. When mouse is over image we see undo.png and when mouse is out of image we see redo.png.
Here is code used for demo:
document.getElementById("image").src = "http://www.userinterfaceicons.com/80x80/undo.png";
onmousemove event occurs when the mouse pointer is moved. Each time a user moves the mouse one pixel, a mousemove event occurs.
onmouseout event occurs when the mouse pointer moves away from a specified object.
For demo purposes are used free icons from user interface icons.
For blogger users:
Show and hide html elements