0
iPad의 Safari에서 이상한 상황이 발생합니다. "핑퐁 (ping-pong)"방식으로 재생할 수있는 스프라이트 시트 기반 애니메이션 시퀀스가 있습니다. 한 번 클릭하면 마지막 프레임까지 앞으로 재생되고 뒤로 클릭하고 프레임 1에 도달 할 때까지 뒤로 재생됩니다.iPad의 Safari가 애니메이션 프레임 요청을 중단하지 않습니다.
처럼 그 사용JS 보이는이 모든 데스크톱 브라우저에서 완벽하게 잘 작동, 아직 아이 패드 사파리는 애니메이션 프레임을 요청 멈추지 않을 것입니다
$('.pingpong').each(function(){
var step = parseInt($(this).width(), 10);
var frames = parseInt($(this).data('frames'), 10);
var img = $(this).find('img');
var running = false;
$(this).data('playForward', true);
$(this).bind(interaction, function(){ //interaction is tap on mobiles and click on desktops
if (!running){
running = true;
var lastExecution = new Date().getTime();
var counter = 1;
function pingpong(){
var now = new Date().getTime();
if (now - lastExecution >= (1000/config.fps)){ //animation is supposed to run at 12fps
img.css('margin-left', $(this).data('playForward') ? '+=' + step + 'px' : '-=' + step + 'px');
counter++;
lastExecution = new Date().getTime();
}
if (counter != frames){
requestAnimationFrame(pingpong);
} else {
$(this).data('playForward', !($(this).data('playForward'))); //this change of direction is triggered on iOS as well strangely enough
running = false;
}
}
pingpong();
}
});
});
, 애니메이션은 "오버 플로우는"이미지는 것까지 나는 마침내 (마진을 통해) 사라졌지 만 전화 번호가 requestAnimationFrame 일 때 (나는 폴 아일랜드어 심 BTR을 사용하고있다. 그러나 webkitRequestAnimationFrame을 사용하면 아무런 차이가 없다.) 나는 재귀적인 것을 볼 수있다. pingpong c 모든 것이 iOS에서 멈추지 않습니다 (데스크톱에서). 또한 cancelAnimationFrame을 시도하면 내 전화 인 id에 아무런 차이가 없습니다.
내 이해가 requestAnimationFrame에 결함이 있습니까? 아니면 여기에 다른 것을 놓치고 있습니까? iPad에서 new Date().getTime() 동작에 차이가 있습니까? 나는 현재 setInterval 기반의 솔루션을 사용하고 있지만이 행동에 정말 완전히 우스꽝스러워서 누군가 내가 지금 여기서 잘못 생각한 것일까?