Tăng/giảm số thập phân của animate jQuery

Question

Tôi muốn tạo hiệu ứng khác biệt giữa hai số thập phân theo từng bước.

Đã tìm thấy Joss Crowcroft's solution cho số nguyên hoạt động tốt và tôi đã thực hiện example on jsfiddle. Đoạn mã:

$({numberValue: 35}).animate({numberValue: 100}, { 
    duration: 1000, 
    easing: 'linear', 
    step: function() { 
     $('#dynamic-number').text(Math.ceil(this.numberValue)); 
    } 
}); 

Nhưng nếu tôi muốn tạo hiệu ứng động từ ví dụ 2.85 đến 3.25, không thể thực hiện theo cách này. Có phải được hoạt hình cả hai phần, số nguyên và số thập phân. Nó có thể được thực hiện theo cách đơn giản hơn ngoại trừ hình ảnh động tách biệt cho số nguyên và số thập phân?

Answer 1

Ý bạn là như thế này?

var currentNumber = $('#dynamic-number').text(); 

$({numberValue: currentNumber}).animate({numberValue: 100}, { 
    duration: 8000, 
    easing: 'linear', 
    step: function() { 
     $('#dynamic-number').text(Math.ceil(this.numberValue*100)/100); 
    } 
}); 

Answer 2

Hãy thử điều này

var currentNumber = $('#dynamic-number').text(); 

$({numberValue: currentNumber}).animate({numberValue: 100}, { 
duration: 8000, 
easing: 'linear', 
step: function (now) { 
     $('#dynamic-number').text(now.toFixed(2)); 
} 
}); 

Dưới đây là the Fiddle