dropoff,
css
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.info-images{
display: flex;
width: 370px;
border: 1px solid #0000FF;
margin: 20px;
}
.info-images-wrap {
background:red;
flex: 1;
}
.info-image-wrap {
width: 85%;
background-color: green;
}
.info-image-wrap img {
max-width: 100%;
height: auto;
margin: 0;
margin-bottom: -4px;
}
.info-images-thumbnails {
text-align: center;
padding: 0;
list-style-type: none;
display: flex;
flex-direction: column;
margin-top: 4px;
}
.info-images-thumbnails li {
width: 90%;
margin: 0px auto;
padding: 0;
max-height: 70px;
}
.info-images-thumbnails li img {
max-width: 100%;
height: auto;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
$(".info-images").each(function() {
var el = $(this),
parentImg = $(".info-image-wrap", el),
img = $("img", parentImg),
parentThumbnails = $(".info-images-wrap", el);
parentThumbnails.on("click", "a", function(e) {
e.preventDefault();
img.attr("src", $(this).data("image"))
}).find("a:first").click()
})
});
</script>
</head>
<body>
<div class="info-images">
<div class="info-images-wrap">
<ul class="info-images-thumbnails">
<li><a href="http://zella.nasatheme.com/wp-content/uploads/2018/11/5696300305_2_6_1.jpg" data-image="http://zella.nasatheme.com/wp-content/uploads/2018/11/5696300305_2_6_1.jpg"><img src="http://zella.nasatheme.com/wp-content/uploads/2018/11/5696300305_2_6_1-350x455.jpg"></a></li>
<li><a href="http://zella.nasatheme.com/wp-content/uploads/2018/10/5696300305_2_1_1.jpg" data-image="http://zella.nasatheme.com/wp-content/uploads/2018/10/5696300305_2_1_1-595x774.jpg"><img src="http://zella.nasatheme.com/wp-content/uploads/2018/10/5696300305_2_1_1-350x455.jpg"></a></li>
<li><a href="http://zella.nasatheme.com/wp-content/uploads/2018/09/product-detail-5.jpg" data-image="http://zella.nasatheme.com/wp-content/uploads/2018/09/product-detail-5.jpg"><img src="http://zella.nasatheme.com/wp-content/uploads/2018/09/product-detail-5.jpg"></a></li>
<li><a href="http://zella.nasatheme.com/wp-content/uploads/2018/10/5696300305_2_2_1.jpg" data-image="http://zella.nasatheme.com/wp-content/uploads/2018/10/5696300305_2_2_1-595x774.jpg"><img src="http://zella.nasatheme.com/wp-content/uploads/2018/10/5696300305_2_2_1-350x455.jpg"></a></li>
</ul>
</div>
<div class="info-image-wrap">
<a href="#"><img src="http://zella.nasatheme.com/wp-content/uploads/2018/11/5696300305_2_6_1.jpg"></a>
</div>
</div>
<div class="info-images">
<div class="info-images-wrap">
<ul class="info-images-thumbnails">
<li><a href="http://zella.nasatheme.com/wp-content/uploads/2018/11/5696300305_2_6_1.jpg" data-image="http://zella.nasatheme.com/wp-content/uploads/2018/11/5696300305_2_6_1.jpg"><img src="http://zella.nasatheme.com/wp-content/uploads/2018/11/5696300305_2_6_1-350x455.jpg"></a></li>
<li><a href="http://zella.nasatheme.com/wp-content/uploads/2018/10/5696300305_2_1_1.jpg" data-image="http://zella.nasatheme.com/wp-content/uploads/2018/10/5696300305_2_1_1-595x774.jpg"><img src="http://zella.nasatheme.com/wp-content/uploads/2018/10/5696300305_2_1_1-350x455.jpg"></a></li>
<li><a href="http://zella.nasatheme.com/wp-content/uploads/2018/09/product-detail-5.jpg" data-image="http://zella.nasatheme.com/wp-content/uploads/2018/09/product-detail-5.jpg"><img src="http://zella.nasatheme.com/wp-content/uploads/2018/09/product-detail-5.jpg"></a></li>
<li><a href="http://zella.nasatheme.com/wp-content/uploads/2018/10/5696300305_2_2_1.jpg" data-image="http://zella.nasatheme.com/wp-content/uploads/2018/10/5696300305_2_2_1-595x774.jpg"><img src="http://zella.nasatheme.com/wp-content/uploads/2018/10/5696300305_2_2_1-350x455.jpg"></a></li>
</ul>
</div>
<div class="info-image-wrap">
<a href="#"><img src="http://zella.nasatheme.com/wp-content/uploads/2018/11/5696300305_2_6_1.jpg"></a>
</div>
</div>
</body>
</html>