Fetch product image with color in product.tpl

[Mario90]

Hi,
i would like to show product images in the Color section of product.tpl template.
 

<ul id="color_to_pick_list" class="clearfix">

 

Colors are shown inside this div at line 547. I would like to show product image associated to the color as the background image of the anchor here at line 552:

 

<a href="{$link->getProductLink($product)|escape:'html':'UTF-8'}" id="color_{$id_attribute|intval}" 
name="{if isset($colors.$id_attribute.value)}{$colors.$id_attribute.name|escape:'html':'UTF-8'}{/if}" 
class="color_pick{if ($group.default == $id_attribute)} selected{/if}"
{if !$img_color_exists && isset($colors.$id_attribute.value) && $colors.$id_attribute.value} 
style="background: {$colors.$id_attribute.value|escape:'html':'UTF-8'};"{/if} <== NEED TO EDIT HERE!
title="{if isset($colors.$id_attribute.value)}{$colors.$id_attribute.name|escape:'html':'UTF-8'}{/if}">

How can i fetch the product image associated to the color to show? Thank you.

Edited March 23, 2016 by Mario90 (see edit history)