javascript увеличение на изображението по подразбиране след промяна image src value - javascript, jquascript, html, css, image

Има проблем с моя javascript тук. Първо, ако кликна върху изображението, то ще увеличи изображението. Проблемът е, когато изображението се промени на друг и кликне, все още увеличава първото изображение, а не новото.

Моят html (контейнер за показване на изображение и увеличение)

<div class="col-md-8">
<span  id="ex3" class="zoom">
<img class="img-responsive" id="myImage" width="750" height="550" src="/images/<?php echo "./image/product/p1/". $row["item_image"]. ".jpg"; ?>">
</span>
</div>

Моят html (следващото изображение, което искам да кликна и увеличи)

<div class="col-sm-3 col-xs-6">
<a href="#">
<img class="img-responsive portfolio-item subimage"  onclick="changeImage1(); <?php $show1="./image/product/p1/". $row["item_image"]. ".jpg"; ?>" src="/images/<?php echo "./image/product/p1/". $row["item_image"]. ".jpg"; ?>" alt="">
</a>
</div>

Моят Javascript в маркер за тяло

function changeImage1() {
var image = document.getElementById("myImage");
var submage = document.getElementsByClassName("subimage")[1].src;
image.src= submage;
}

Моят javascript в главния маркер (функция за мащабиране)

 jQuery(document).ready(function($){
$("#ex3").zoom({ on:"click" });
});

Как да го поправите, някакви идеи? Благодаря.

Отговори:

липсва id = "ex3" в следващото изображение кликнете върху увеличаване на html. Опитайте нещо такова:

jQuery(document).ready(function($){
$("img").zoom({ on:"click" });
});