javascript サムネイル画像クリックでメイン画像切り替え

Posted 2021-05-03

<div class="mainImage">
    <img src="/sea01.jpg" alt="海１">
</div>
<div class="thumbnails">
    <img src="sea01.jpg" alt="海１">
    <img src="sea02.jpg" alt="海２">
    <img src="sea03.jpg" alt="海３">
</div>

$(function(){
 $('.thumbnails img').click(function(){
  var $thisImg = $(this).attr('src');
  var $thisAlt = $(this).attr('alt');
  $('.mainImage img').attr({src:$thisImg,alt:$thisAlt});
 });
});