Animated Images

  • Kurthead+1
  • Graduate
  • Graduate
  • Kurthead+1
  • Posts: 131

Post 3+ Months Ago

Can somebody explain what variable "x" is doing in the stepBall() function?
And what timer2 is doing?


Code: [ Select ]
function moveDomObj(id, left)
{
 var domObj = document.getElementById('moveLeft');
 domObj.style.top = "630px"
 domObj.style.left = "540px"
 domObj.style.left = left + "px";
}


var s = 0;

function stepBall2()
{
 x = 50+4*s; // a parabolic path y=x*x
 moveDomObj("ball2", x);
 s++;
 if (s < 130)
  timer2 = setTimeout(stepBall2, .5);
 else
  s = 0; // so we can do it again
}

function startBall2()
{
 timer2 = setTimeout(stepBall2, 50);
}
  1. function moveDomObj(id, left)
  2. {
  3.  var domObj = document.getElementById('moveLeft');
  4.  domObj.style.top = "630px"
  5.  domObj.style.left = "540px"
  6.  domObj.style.left = left + "px";
  7. }
  8. var s = 0;
  9. function stepBall2()
  10. {
  11.  x = 50+4*s; // a parabolic path y=x*x
  12.  moveDomObj("ball2", x);
  13.  s++;
  14.  if (s < 130)
  15.   timer2 = setTimeout(stepBall2, .5);
  16.  else
  17.   s = 0; // so we can do it again
  18. }
  19. function startBall2()
  20. {
  21.  timer2 = setTimeout(stepBall2, 50);
  22. }
  • ScottG
  • Proficient
  • Proficient
  • ScottG
  • Posts: 477

Post 3+ Months Ago

Ok first thing the X variable is being calculated to set the left position in the moveDomObj. It looks funny but remember order of operations it is taking 4 times the step var then adding 50 so basically 50 + (4 * s)

iterations
1) x = 50 ... s = 0 (4 * 0) = 0 + 50 = 50
2) x = 54 ... s = 1 (4 * 1) = 4 + 50 = 54
3) x = 58 ... s = 2 (4 * 2) = 8 + 50 = 58
4) x = 62 ... s = 3 (4 * 3) = 12 + 50 = 62
....
up to 130 where the step var resets to 0 and the animation stops

now the timer2 variable is the identifier of the timer so you can do things to the timeout like stop it by using the clearTimeout(timer2)

example
http://jsfiddle.net/r3wGm/

Post Information

  • Total Posts in this topic: 2 posts
  • Users browsing this forum: No registered users and 64 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.