클릭하여 이미지 바꾸기 및 바꾸기

Question

Im은 (는) 클릭하여 사진을 바꾸고 전환하려고합니다.하지만 내 코드에 스택이 있습니다. 큰 그림을 바꿀 수는 있지만 작은 변화는 없습니다. 내가 지금까지 무엇을 여기

:

HTML을

<div class="image_container"> 
     <a href="" > 
    <img class="big_image" src="picture1" /> 
     </a> 
</div> 
<div class="pics_container"> 
    <img class="lilla" src="picture2" /> 
    <img class="lilla" src="picture3" /> 
</div> 

    $('.lilla').on('click',function(){ 
      $('.big_image').attr('src',$(this).attr('src')); 
      $(this).attr('src',$('.big_image').attr('src')); 
    }) 

내가 사진 2를 클릭하거나 3가 PICTURE1의 장소에있을 것이며, PICTURE1이의 자리를 차지할 때 내가 원하는 것은 클릭 된 그림 2 또는 3.

제 그림에서 작은 그림은 그림 1을 대체하는 데는 좋지만 그림 1은 클릭 한 그림을 대체하지 않았습니다. 나는 무엇을 놓쳤는가 pls? 당신이

$('.lilla').on('click',function(){ 
     var big_src = $('.big_image').attr('src'); 

     $('.big_image').attr('src', $(this).attr('src')); 

     $(this).attr('src', big_src); 

}); 

Answer 1

당신은 내가 다음 각 사진에 클래스를 적용하는 것이시 참조 할 큰 이미지에서 소스를 저장하는 변수가 필요합니다. 클릭 기능에서 다음을 수행 할 것입니다.

예

$('#imagereplacing).attr('src',$('.exampleClass').attr('src')); 

Answer 2

을 그것을 교체하기 전에

working Demo fiddle here