JSFiddle - React, Tailwind, and code Playground
HTML
<div class="galery"><img id="image" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQXbT93y8UPAg6XxyL7sh0mXwRDzZbNetpN-RxJ2_jg3tPHel4wSw" >
<a href="#" id="i1" class="small"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQXbT93y8UPAg6XxyL7sh0mXwRDzZbNetpN-RxJ2_jg3tPHel4wSw" /></a>
<a href="#" id="i2" class="small"><img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcT2qopVt9XQ8OicNk5WfD1V8_eGjbnRhXsYcexzZrxf5hf6QnK1" /></a>
<a href="#" id="i3" class="small"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTthR3MoF0VtcO12i9LdJesPgz-z9DhDehV36_tOC9vpSsd5FKN" /></a></div>
CSS
.galery {
position: relative;
}
.small img {
height: auto;
width: 50px;
border: 3px solid #fff;
position: absolute;
left: 0;
bottom: 0px;
float: left;
}
#i1 img { left: 0px;}
#i2 img { left: 60px;}
#i3 img {left: 120px; }
JavaScript
$(".small").click(function() {
$(".small").find("img").css("bottom", "0px");
var text = $(this).find("img").attr("src");
$('#image').attr("src", text);
$(this).find("img").css("bottom", "10px");
});