스크롤 탑 애니메이션을 시작하기 전에 섹션을 건너 뛰기

Question

skrollr 및 jquery를 사용하여 sidescrolling choose your-own 모험 유형을 만드는 중입니다. 자바 스크립트 (내 개선을 시도)에서 내 현미경 기술로 나는 한 가지를 제외하고 일을 할 수있었습니다.

섹션을 재생하기 위해 스크롤 탑에 애니메이션을 적용하고 있지만 연주하기 전에 섹션을 건너 뛰고 싶습니다. skrollr가 모든 것을 순차적으로 "재생"하기 때문에, scolltop은 자연스럽게 당신이있는 곳과 "대상"사이의 모든 것을 "재생"하기를 원합니다. scrolltop에 위치를 확인하고 대상과 비교하는 방법 및 스크롤 애니메이션을 시작하기 전에 섹션을 건너 뛰는 방법을 알고 싶습니다.

이 질문은 주로 jquery 질문입니다. 같은 간단한 jQuery를 사용하여 메신저, 당신에게 아이디어를 제공하려면 :

$('#chapter4a').on('click', function() { 
     $('html, body').animate({ scrollTop: 2750 }, 5000); 

     }); 

내가이 0이다가,가 500ms 이상 (200)에 애니메이션을 한 후 2000 년까지 건너 뛰고 다른 1000MS를 통해 2700에 애니메이션을 적용 할 경우. 그 논리는 어떻게 생겼을까요?

미리 감사드립니다.

Answer 1

jQuery에서는 애니메이션에 different easing을 사용할 수 있습니다. 그걸 살펴볼 가치가있을 수도 있고, 필요한 것을 가지고있을 수도 있고 그렇게 많이 코딩 할 필요가 없을 수도 있습니다.

, 당신의 질문에 대답하기 위해,이 작업을해야합니다 :

$('#chapter4a').on('click', function() { 
     $('html, body').animate({ scrollTop: 200}, 500,function() { 
      $('#chapter4a').scrollTop(2000); 
      $('html, body').animate({ scrollTop: 2700}, 1000); 
     }); 
});