이 이미지 슬라이더 여기

Question

를 정리하는 방법, 나는이 이미지 슬라이더를 실행하면 기본적으로, 그것은 상당히 잘 페이드 jQuery 코드 그래서

$(function(){ 
    $('.fadein img:gt(0)').hide(); 
    setInterval(function(){ 
    $('.fadein :first-child').fadeOut() 
     .next('img').fadeIn() 
     .end().appendTo('.fadein');} 
     , 4000); 
}); 

HTML 코드 여기

<div class="fadein"> 
     <img src="http://farm3.static.flickr.com/2610/4148988872_990b6da667.jpg"> 
     <img src="http://farm3.static.flickr.com/2597/4121218611_040cd7b3f2.jpg"> 
     <img src="http://farm3.static.flickr.com/2531/4121218751_ac8bf49d5d.jpg"> 
</div> 

입니다하지만 경우 그것은 페이드되고, 페이딩 이미지를 아래로 밀어 낸다. 그리고 그 페이딩 이미지가 푸시 다운 될 때, 아래의 다른 HTML 컨텐트도 푸시 다운됩니다. 그러나 두 번째 이미지가 오면 HTML 컨텐트가 다시 정상으로 재설정되고 프로세스가 다시 시작됩니다.

어떻게 예방할 수 있습니까?

Answer 1

:first-child 요소의 경우 fadeOut() 대신 hide()을 사용해보십시오.

결과 : http://jsfiddle.net/2tRtn/