Как заменить изображение в форме?

Добрый день!
подскажите, пожалуйста,как заменить изображение enter.png при наезде мышью на enter1.png при клике на enter2.png и при убираниии мыши с изображения/кнопки обратно на enter.png?
<table class="table_form">
<tr>
<td><a href="reg">Регистрация</a></td>
<td>
<table class="table_inside_form" cellspacing="0" cellpadding="0">
<form action="" method="GET">
<tr>
<td>
<input type="text" name="login">Логин</td>
<td>
<input type="password" name="password">&nbsp;Пароль
</td>
<td>
<input type="image" src="but/enter.png" alt="Вход" title="Вход">
</td>
</tr>
</table>
</td>
<td><a href="remind">Забыли логин или пароль?</a></td>
</tr>
</table>
По-идее необходимо использовать javascript: onmouseover, onmouseout,onclick но вот вопрос - как это сдклать?) Помогите, пожалуйста))

Уважаемый, вы уже столько тем насоздавали, что хватит на несколько маленьких проектов. Помните, что все хотят кушать. Это намёк как бы.
ps: я не фрилансер.

Три коротких вопроса за последние пол-года работы
если у вас будут вопросы по копирату или по концептам - пишите в личку - не стесняйтесь)
пс спасибо за полезный ответ

Всем кто читает этот вопрос, готовое решение(привет Максим)
<input type="image" src="but/enter.png" alt="Вход" title="Вход"
onMouseDown="this.src='but/enter2.png'" onmouseover="this.src='but/enter1.png'"
onmouseout="this.src='but/enter.png'">
пс все гениальное - просто))

Правильно - использовать 1 картинку и background-position
чтобы при наведении и нажатии не подгружались картинки

ссылка
ссылка