Thanks Jamie, yes that is exactly what I am trying to achieve but I am unsure of how to do this with PHP so that it swap between the first and second image from a product. I guess I could change the file names to include a number - shoe-1.jpg, shoe-2.jpg etc
This is the code to get a simular result using Shopify
<div class="image">
<a href="{{ url }}">
<img src="{{ product.images[0] | product_img_url: 'large' }}" alt="{{ product.title | escape }}" />
<img src="{{ product.images[1] | product_img_url: 'large' }}" alt="{{ product.title | escape }}" style="display:none" />
</a>
</div>
<style type="text/css">
.image a:hover img:first-child{ display:none;}
.image a:hover img:last-child{ display:block;}
</style>