полный костыльный скрипт для лучшего понимания:
<div class="image">
<a href="{{ product.href }}" id="gl_img_{{ product.product_id }}c">
<img src="{{ product.thumb }}" alt="{{ product.name }}" class="img-responsive" />
</a>
<div id="global_video_hover{{ product.product_id }}c" class="global_video_hover none">
<div class="global_video_content">
<img src="{{ product.thumb }}" alt="{{ product.name }}" class="img-responsive" />
{{ product.video }}
</div>
</div>
</div>
<div>
<img src="{{ product.thumb2min }}" alt="{{ product.name }}" class="img-responsive" id="ad_img1_{{ product.product_id }}c" />
</div>
<script>
$('#ad_img1_{{ product.product_id }}c').hover(function() {
my_func2_{{ product.product_id }}c();
});
$('#ad_img1_{{ product.product_id }}c').click(function() {
my_func2_{{ product.product_id }}c();
});
function my_func2_{{ product.product_id }}c() {
$('#global_video_hover{{ product.product_id }}c').slideUp('normal');
$('#gl_img_{{ product.product_id }}c').slideDown('normal');
$('#gl_img_{{ product.product_id }}c').html('<img src="{{ product.thumb2 }}" alt="{{ product.name }}" class="img-responsive" id="ad_img1_{{ product.product_id }}c" />');
}
</script>