애니메이션으로 숫자를 추가하는 방법

스톱워치와 같은 기존 숫자에 숫자를 추가하고 싶습니다. 제 기능은 숫자를 완벽하게 추가하고 있지만 스톱워치와 같은 애니메이션을 추가하고 싶습니다.하지만 시도해 보았습니다. 당신은,는 .text 설정이 콜백의 문자열로 여기 JQuery와 애니메이션을 적용 할 수 있음을 고려하면 여기 working demo 애니메이션으로 숫자를 추가하는 방법

$('a').click(function() { 
    var val = parseInt($(this).text()); 
    var currentVal = parseInt($('#price').text()) 
    var cal = parseInt(val-currentVal) 
    var club = parseInt($('#price').text()) + cal 
    var bb = $('#price').text(club) 
}) 
})

HTML

<a href="#">10000</a> 
<a href="#">12000</a> 
<a href="#">15000</a> 
<div id="price">10000</div>

출처

2012-12-24 jchand

'스톱워치와 같은 애니메이션'을 정의 할 수 있습니까? 내가 본 스톱워치에는 애니메이션이 없으므로 가치가 나타납니다. –

처럼 http://stackoverflow.com/questions/4424099/js-jquery-number-increasing-animation 및 http://stackoverflow.com/questions/5411343/how-to-animate-numbers-using-jquery? –

@RoryMcCrossan : http://thecodeplayer.com/walkthrough/make-a-stopwatch-using-css3-without-images-or-javascript를 참조하십시오. 추가되는 가치를 확인할 수 있습니다. – jchand

자바 스크립트 기능 setInterval을 사용하여 원하는 애니메이션을 만드십시오.

프레임 워크를 사용하지 않고 초보자를위한 초보자 용 javascript animation에 대한 모습이 setInterval입니다.

출처

2012-12-24 12:16:39 vusan

입니다. 예를 들어, 이와 같은 것이 작동 할 수도 있습니다. 작업 예를 here에 JSFiddle 링크에 더 많은 정보가있다

$('#price').fadeOut('fast', function() { this.text(club); this.fadeIn('fast');})

님의 함수의 마지막 줄을 변경합니다.

출처

2012-12-24 11:59:37

애니메이션으로 숫자를 추가하는 방법

답변

관련 문제