jQuery에서 장시간 동안 짧은 거리의 위치에 애니메이션 적용

Question

매우 섬세한 애니메이션을 페이지에 통합하려는 경우 (하늘에 천천히 떠 다니는 구름을 생각해보십시오).

$('DIV#clouds').animate({ left: '100px' }, 30 *1000); 

jQuery에서 구현을 시도했는데 jQuery가 플래시처럼 할 수없는 1px 단위로 처리 할 수 ​​없습니다. 애니메이션이 작동하고 부드럽지 않은데 클라우드가 몇 밀리 초 동안 하나의 픽셀로도 움직일 때마다보기 싫어 보인다.

서브 픽셀 이동이 가능하지 않다는 가정하에, 나는 내가 틀렸다는 것을 묻고 있습니다.

Answer 1

아니요. left 속성은 값으로 전체 픽셀 만 가질 수 있기 때문에 아니오입니다. 모든 jQuery는 픽셀이 left에 100px가 될 때까지 추가합니다. 미화로 부드럽게 움직이기 위해 반 화소를 추가한다고 기대할 수는 없습니다. 플래시는 앤티 앨리어싱을 사용하여이를 수행합니다.

또한 { left : '100px'}은 px 값을 작은 따옴표로 묶어야합니다.