Image change when mouseover on color attribute in product list.

[servetsarap]

Hello friends, 

 

Can anyone help me how to change image when mouseover on color attribute in product list.

 

For example : when I mouseover on the blue color, it displays blue t-shirt image. If green, it displays green t-shirt image.

 

While I was wondering around the topics, I've found a post with an example written by @gonebdg - webindoshop.com

Here is the link of his example: http://jsfiddle.net/gonebdg/k4tf3ykb/ But i couldn't manage the set it to my shop.

 

Can someone help me how can I do this? Which files I need to edit and how?

 

I'm using Prestashop 1.6.1.6 with the default theme.

 

Regards,

 

Thanks.