Constant Speed and variable speed (buffer) movement in Javascript

Personal site

The movement of a div is actually a change in the distance between it and the browser border. If the change rate is certain, it isConstant SpeedIf the change rate is not certain, it is a variable speed movement. When the change rate is proportional to the distance from the browser's border, it can be said that DIV is doingBuffer Motion.
In fact, it is very simple to use a timer to change the border distance of the DIV aggregation browser at intervals.

For example, uniform motion:

Enter the Timer: (every 30 ms)
If (whether to reach the end point)
{Stop timer}
Else do {Change distance}

The method of changing the distance determines whether the constant speed or variable speed (buffer) motion.

For example:

Javascript Code

2. VaRTimer =Null;
6. FunctionStartmove ()
8. {
12. VaROdiv = Document. getelementbyid ('Div1');
14. Clearinterval (timer );
16. Timer = setinterval (Function(){
18. VaRIspeed = 1;
22. If(Odiv. offsetleft> = 300)
24. {
26. Clearinterval (timer );
28. }
30. Else
32. {
34. Odiv. style. Left = odiv. offsetleft + ispeed +'Px';
36. }
38. }, 30 );
40. };

Buffer movement:

Java code

2. VaR timer =Null;
4. Function startmove ()
6. {
8. VaR itarget =300;
12. VaR odiv = Document. getelementbyid ('Div1');
16. Clearinterval (timer );
18. Timer = setinterval (function (){
20. VaR ispeed = (iTarget-oDiv.offsetLeft )/8;
24. Ispeed = ispeed>0? Math. Ceil (ispeed): Math. Floor (ispeed );
28. Ispeed = math. Ceil (ispeed );
30. If(Odiv. offsetleft = itarget)
32. {
34. Clearinterval (timer );
36. }
38. Else
40. {
42. Odiv. style. Left = odiv. offsetleft + ispeed +'Px';
44. }
46. Document. Title = odiv. style. Left +''+ Ispeed;
48. },30);
50. };

In this way, a motion frame is ready! The principle is very simple, but it still needs to be improved. Come on!