Help regarding animate function of the JQuery


#1

I stumbled upon the below-mentioned practice code →

https://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_eff_animate_progressbar

After that, I tried to learn the Jquery animate function here →
http://api.jquery.com/animate/

Most of the things are clear, but I have trouble grasping this concept:

step: function(x) {
$("#demo").text(Math.round(x * 100 / 400)  + "%");
  1. How to decide which function to use. Are there any limitations to learn or the functions are Infinite?
  2. I still do not understand the maths part of the function.

#2

The progress bar is 400 pixels wide, so he divides by 400 to get a number from 0 to 1.
He wants the displayed number to be from 0 to 100, so he multiplies by 100.


#3

That means he divides it into 400 units(Each of 1 Pixel). Ok, I got it.

that means the bar will progress every 4pixel:

4px, 8px, 12px................40px, ..................................400px

Like this?

Also in function(x)
x = width = 400px, Right?


closed #4

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.