velocity.js로 루프 애니메이션

Question

나는 velocity.js로 루프 애니메이션을 만들려고합니다. X 축의 오브젝트를 0에서 473으로 변환 한 다음 0에서 473까지 변환하려고합니다.

이렇게 (아래 코드) 성공했지만 Android Chrome 및 iOS Chrome 브라우저에서는 약간의 지연 (지연)으로 시작됩니다. 누군가 도울 수 있습니까?

function start() { 
    $(".el").velocity(
    { 
     translateX: [ -473, 0 ] 
    }, 
    { 
     duration: 8000, 
     delay: 0, 
     easing: "linear", 
     complete: reset 
    }); 
} 
function reset() { 
    $(".el").css("transform", "translate(0px, 0px)"); 
    start(); 
} 
start(); 

Answer 1

강제 공급을 사용하고 있으므로 .css() 통화는 중복됩니다.

$el = $(".el"); 
function start() { 
    $el.velocity(
    { 
     translateX: [ -473, 0 ] 
    }, 
    { 
     duration: 8000, 
     delay: 0, 
     easing: "linear", 
     complete: start 
    }); 
} 

start(); 

그리고 당신은 라이브 버전 here을 볼 수 있습니다 : 그 라인을 제거

는 안드로이드 크롬의 초기 지연을 제거합니다.