jQuery 또는 CSS를 사용하여 앞면 이미지를 위로 및 뒤로 이미지를 아래로 이동하는 방법

Question

두 개의 원형 이미지가 있다고 가정하면 앞면 이미지는 뒤쪽 이미지를 완전히 커버합니다. 앞면 이미지를 클릭하면 위쪽으로 움직이고 뒷면 이미지는 아래쪽으로 움직이고 서로의 둥근 가장자리에서 멈추게합니다. 두 번째 클릭은 앞면 이미지가 뒤 표지를 덮도록합니다.

다음

$("#div1").insertAfter($("#div2")); 

가 jsFiddle입니다 : 당신이 다른 요소의 위 또는 아래 요소를 이동하고자하는 경우

Answer 1

, 당신은 insertBefore 및 insertAfter 사용할 수 있습니다 http://jsfiddle.net/Eb3cv/

Answer 2

샘플 CSS

.above{position:absolute;z-index:2} 
.under{position:absolute;z-index:3} 
.container{position:relative;z-index:1} 

샘플 개체

(210) 전면에 하나 개의 요소를 가져오고 뒷면에 ​​다른 사람을 보내거나 그냥 다른 아래 하나의 위치를 ​​찾고 계십니까

$('img').click(function(){ 

$('#img1').toggleClass('above'); 
$('#img1').toggleClass('under'); 
$('#img2').toggleClass('above'); 
$('#img2').toggleClass('under'); 

}); 

Here's an example