여러 이미지 페이드 아웃 스크롤

Question

나는 한 페이지를 가지고 있으며 네비게이션 지점마다 사이트 중앙의 이미지가 색이 바래서 바뀝니다.

다음과 같이 페이드 인 할 수있었습니다. $ ("# 액티브 3"). fadeIn (2000); 그러나 문제가 다시 사라집니다. 설명해 드리겠습니다. 5 개의 이미지가있는 5 개의 내비게이션 지점이 있습니다. 예를 들어 첫 번째에서 세 번째 네비게이션 지점으로 스크롤하면 모든 네비게이션 지점에서 서로 위에 놓인 그림이 3 개 있습니다.

내가 처음 세 번째 점에서 처음 점프하면 어떻게 든 꼭대기에 첫 번째 그림을 얻으려면 (Z- 색인이 사라지지 않으므로 나에게 도움이 안되나요?) 아니면 2와 3을 퇴색시킵니다.

그래서 나는 활성 네비게이션 지점에없는 각 이미지를 페이드 아웃하려고했습니다.

$("#active1").fadeOut(2000); 
$("#active2").fadeIn(2000); 
$("#active3").fadeOut(2000); 
$("#active4").fadeOut(2000); 
$("#active5").fadeOut(2000); 

을하지만 fadeOuts 큐가 동시에 발생하지 않는 것 같습니다 : 나는 두 번째 navigaton 점에있을 때 예를 들어 코드가 될 것이다.

이

사이트 메신저가 작업 : http://palmira-lopez.de

이 도와 주셔서 감사합니다! 는 또한 sitenote,이 상용 프로젝트하지만 내 엄마 :

Answer 1

위한 사이트가 아닙니다하지만 fadeOuts가

당신은 무엇이든 마무리 jQuery를 알려 .finish()를 사용할 수있는 큐 것으로 보인다 현재 대기 중입니다.

$("#active1").finish().fadeOut(2000); 
$("#active2").finish().fadeIn(2000); 
$("#active3").finish().fadeOut(2000); 
$("#active4").finish().fadeOut(2000); 
$("#active5").finish().fadeOut(2000); 

이

당신이 비록 원하는 것을하지 않을 수 있습니다 당신은 과정에없는 것들에 대한 .hide()을 할 수 있습니다.

클래스를 추가하고 CSS 전환을 사용하는 것이 더 나을 것입니다.