Плавная смена картинки
 

Картинка document.getElementById('img') в переменной color:

<script>
function showColor(t, color, colorText) {
var q = $(t).parents(".products-wrap").first();
document.getElementById('img').innerHTML='<img class="responsive-img" title="Smart Balance SUV 10 Черный" alt="Smart Balance SUV 10 Черный" src="'+color+'">';
$(q).find(".color-text").text(colorText);
}
</script>

Подскажите пожалуйста, как сюда можно прикрутить плавную смену картинки?

Большое спасибо!

q уже jQ объек - var q = $(t).parents(".products-wrap").first(); да и зачем это нужно, если можно сразу:

$('#img').html('<img class="responsive-img" title="Smart Balance SUV 10 Черный" alt="Smart Balance SUV 10 Черный" src="'+color+'">');
$(t).parents(".products-wrap:first .color-text").text(colorText);

Смена, это как минимум одного на другое, может быть появление?

DemonGuards,
https://javascript.ru/forum/dom-wind...tml#post450508

Прошу прощения, но я не понимаю Вашего вопроса т.к. моего опыта явно не достаточно. Поэтому обращаюсь за советом: что нужно добавить, чтобы изменяемая в

<img class="responsive-img" title="Smart Balance SUV 10 Черный" alt="Smart Balance SUV 10 Черный" src="'+color+'">

картинка появлялась плавно? Спасибо.

DemonGuards,

function showColor(t, color, colorText) {
$('#img').hide().html('<img class="responsive-img" title="Smart Balance SUV 10 Черный" alt="Smart Balance SUV 10 Черный" src="'+color+'">').fadeIn(900);

$(t).parents(".products-wrap:first .color-text").text(colorText);
}

Большое спасибо! Работает!