In order for front-end movement and interaction to be less obtrusive and rigid, but to be more natural and friendly to our senses, we usually introduce transitions.
Make the element gradually transition to the value we predetermined.
At this time, we need to introduce the cyclic timer setInterval();
In this way, the element value can be controlled to gradually reach the predetermined value.
We use visual errors to cycle the elements to a predetermined value.
Note: In order to avoid the cumulative effect of the timer, you need to clear the previous one before starting the timer each time .
So we have to define a global variable for the timer,
Otherwise, the first clear timer will report an undefined error.
But these are far from natural enough.
Need to be more natural. We also need to add some dynamic equations to adjust the speed.
NEXT WILL BE BETTER······