Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jquery "animate" variable value

I need to "animate" a variable with jquery.

Example: The variable value is 1. The value should be 10 after 5 seconds. It should be increase "smoothly".

Hope that you know what I mean.

Thank you!

like image 310
mstuercke Avatar asked Sep 07 '12 11:09

mstuercke


People also ask

Is jQuery slower for animations?

jQuery can be several times slower than CSS when talking about animations. CSS animations and transitions have the advantage of being hardware accelerated by the GPU, which is really good in moving pixels.

What is the correct syntax of animate () method?

The jQuery animate() method is used to create custom animations. Syntax: $(selector).animate({params},speed,callback);

What do you enter in the second argument of the jQuery animate () function?

Step Function It accepts two arguments ( now and fx ), and this is set to the DOM element being animated. fx : a reference to the jQuery.

What does an easing do jQuery?

Easing functions specify the speed at which an animation progresses at different points within the animation.


1 Answers

try:

$({someValue: 0}).animate({someValue: 10}, {
    duration: 5000,
    step: function() { 
        $('#el').text(Math.ceil(this.someValue));
    }
});

<div id="el"></div>
like image 147
Sudhir Bastakoti Avatar answered Oct 16 '22 07:10

Sudhir Bastakoti