Mouse over effect - Repost

[Guest]

I am still tryign to nail down this mouse over effect.

I have changed the categories.tpl file inside the boxes folder of my skin to show my category images as buttons. To do this I had to also change the categories.inc.php inside the inculdes folder.

The images work great as buttons...but now i would like to have those same images swap with other ones when the mouse moves over the button.

The images that i will be using to swap with are located in the images/uploads folder

here is the categories.tpl code:

<!-- BEGIN: categories -->

<div class="boxContentRight">

<ul>

<a href="index.php"><img src="../../store/images/uploads/01quiver.jpg" alt="test" border="0" /></a>

<!-- BEGIN: li -->

<a href="index.php?act=viewCat&amp;catId={DATA.cat_id}"><img src="../../store/images/uploads/{DATA.cat_image}" alt="{DATA.cat_name}" border="0" /></a>

<!-- END: li -->

</ul>

</div>

<div class="boxContentRight">

<!-- BEGIN: sale -->

<a href="index.php?act=viewCat&amp;catId=saleItems" class="txtDefault">{LANG_SALE_ITEMS}</a>

<!-- END: sale -->

</div>

<!-- END: categories -->

what do i need to do to make the image swap mouse over effect work?