자바 스크립트 아코디언 - 시간 추적 질문

Question

나는이 자바 스크립트 튜토리얼에서 읽었습니다. http://www.switchonthecode.com/tutor...ccordion-menus 기본적으로 jquery가 아닌 순수한 자바 스크립트를 사용하여 아코디언을 만드는 방법을 보여줍니다. 애니메이션 추적의 실제 부분까지 모두 나에게 의미가있었습니다. 그는 "모든 기능 덕분에 애니메이션 기능에서 가장 먼저 수행 한 작업은 마지막 애니메이션 반복 이후 경과 된 시간을 파악하는 것입니다." (. 일() 다음 getTime()을) 코드 :

var elapsedTicks = curTick - lastTick; 

lastTick이 함수가 호출 될 때의 값과 동일하고 기능이 수신 될 때 curTick의 값과 동일 그리고,이 코드를 사용하여 . 나는 왜 우리가 여기서 다른 하나를 빼는 이유를 이해하지 못한다. 나는이 두 값 사이에 눈에 띄는 시차가 있다는 것을 상상할 수 없다. 아니면 뭔가를 놓친 것일 수도 있습니다. animate() 함수는 메뉴 제목을 클릭 할 때마다 한 번만 호출되거나 증분 애니메이션 효과를 만들기 위해 여러 번 호출됩니까?

setTimeout("animate(" + new Date().getTime() + "," + TimeToSlide + ",'" + openAccordion + "','" + nID + "')", 33); 

응답 해 주셔서 감사합니다.

Answer 1

lastTick가

lastTick 함수가되었을 때의 값과 같은 함수가 호출 될 때의 값과 동일 이전 애니메이션의 마지막 프레임이라고. 그 이후 스크립트는 브라우저에 다시 제어권을 부여하여 33 밀리 초 후에 다시 호출하도록 요청했습니다.

그래서 curTick-lastTick은 일반적으로 약33이지만 브라우저가 다른 일들로 인해 지연되는 경우 훨씬 높을 수 있습니다. 이것이 시간을 읽는 것이 전혀 필요하지 않은 이유입니다.

더 일반적으로 코드 이런 종류의, 당신은 애니메이션 변수에 시작 시간을 저장하는 것, 특히 설정 (대신 완전히 새로운 시간 제한 기능을 각 시간을 설정하는, 그래서 종종 매를 확인 setInterval를 사용 문자열에서 시간 초과, 이는 아주 못생긴다).

ETA :

후 금회

아니를 전달하는 애니메이션() 함수를 실행. set-timeout 호출을 다시보십시오.

setTimeout("animate(" + new Date().getTime() + ","... 

문자열을 만드는 중입니다. new Date().getTime()은 시간 초과 설정 시간에 이 아닌이 계산됩니다. 마지막 프레임, 다음 프레임의 타임 아웃이 발생하지 않습니다 시간의 마지막 시간입니다

setTimeout("animate(1275139344177, 250, 'Accordion4Content', 'Accordion4Content')", 33) 

: 그것은 같은 문자열을 끝납니다.

이와 같은 문자열에 JavaScript 코드를 넣는 것은 매우 혼란스럽고 문제를 범하기 쉽고 일반적으로 실용적인 것으로 간주됩니다.인라인 함수로 처리하는 것이 더 명확합니다.

var passTick= new Date().getTime(); 
setTimeout(function() { 
    animate(passTick, TimeToSlide, openAccordion, nID); 
}, 33);