Shopify模板修改-栏目图片变换

应客户的要求,实现栏目图片在鼠标悬停的时候，实现图片的变换。

共享代码，共享此段代码：
1：在产品模板，修改产品图片代码为：

  <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  }}" />
   </a>

2：在模板样式文件增加样式：

<style type=”text/css”>
.product .image a img.second { display: none; }
.product .image a:hover img.first { display: none; }
.product .image a:hover img.second { display: block; }
</style>