2012-05-15 3 views
0

버튼에 반복적 인 '박동 하트 비트'시각 효과를 만들려고합니다. CSS에서이 작업을 수행 할 수 없다고 생각합니다. 그러나 jQuery 또는 JS에서 백그라운드 이미지 변경을 어떻게 애니메이트합니까?jQuery에서 애니메이션 배경 이미지가 어떻게 변경됩니까?

나는 다음과 같은

$(this).animate({ 
        'background-image' : '-webkit-linear-gradient(top, white, red)', 
        'background-image' : '-linear-gradient(top, white, red)' 
       }, 4000); 

을 할 수 있기를 원하지만 jQuery를은 CSS지도에서 숫자가 아닌 값을 허용하지 않습니다.

감사합니다.

+0

다음을 확인하십시오. http://stackoverflow.com/questions/2983957/animate-background-image-change-with-jquery – Dhiraj

+0

css3 애니메이션 (현재)으로 CSS 배경을 애니메이션으로 만들 수 없습니다. 배경 이미지에 애니메이션을 적용 할 수 있습니다 (이 시점에서만 Chrome 18 만 해당). jQuery는 그래디언트의 방향 애니메이션도 허용하지 않습니다. – mrtsherman

답변

0

cssHooks을 사용하여 자신 만의 애니메이션을 코딩 할 수 있습니다. 배경을 원하는대로 설정하고 숫자를 값으로 사용하는 가짜 CSS 스타일 키를 만든 다음 .animate()에 가짜 스타일을 사용할 수 있습니다. 다른 속성에 애니메이션 경우

http://api.jquery.com/jQuery.cssHooks/

또는 수동 (당신이 jQuery를 매우 이전 버전을 사용하지 않는 권장하지 않음) 변경 사항을 확인하기 위해 step 콜백을 사용할 수 있습니다.

관련 문제