javascript setTimeout and return logic

compninja25

Hi guys! I can't figure out what the heck I'm doing wrong. I'm making a (hoping to at least) simple function that will take a white border and fade it to black on a mouseOver. Here's what I have so far:

      var color = "rgb(" + number + "," + number + "," + number + ")";
      object.style.borderColor = color;
      
                
      if (direction == "out") {
          if (number == 0) return;
              
          var newNumber = number - 1;
          window.setTimeout(animation(object, direction, newNumber), 500);
      }
      
      if (direction == "in") {
          if (number == 255) return ;
          
          var newNumber = number + 1;
          window.setTimeout(animation(object, direction, newNumber), 500);                       
      }
  }

</script>

Now, what happens (when I use the debugger in visual studio 2008), the function executes correctly until the number variable gets to 255. At 255, the system does see the if (number == 255) return; part and appears to execute it. What happens after that when I hit F11 to continue stepping into the code, it jumps down to the window.setTimeout line again and tell's me there's an invalid argument. What's really weird, is that the number variable has now gone back to 254! I've even tried changing the if statement to stop at 250 and other various numbers, but it still seems to subtract a number and then give me the failure insted of stopping execution. Looking at other setTimeout examples, I also tried different syntax including wrapping the function in quotes, but this is the only way I've been able to get it to actually call the function. Wrapping it in quotes seems to just jump to the next line and return. I'm still fairly new to javascript, so I wouldn't doubt that there's something wrong with the flow of my logic, but I'm to the point where I feel like I'm not getting anywhere. Hopefully another set of eyes might see what's not obvious to me. Thanks!

Knowledge is not power, however, the acquisition and appropriate application of knowledge can make you a very powerful individual.

Covean

window.setTimeout needs a function-"pointer" as first argument. If I'm right this can only be a function without arguments. window.setTimeout(animation, 500); <- rigth way window.setTimeout(animation(object, direction, newNumber), 500); <- wrong Starts the function animation direct without waiting 500ms.

Not Active

I'd look at the JQuery[^] library to do this and save yourself a whole lot of hassles.

only two letters away from being an asset

compninja25

oh that is cool! To be honest I've never really looked into jQuery but you're right. It'll probably make most sense to just use that animate function they have. Thanks!

Knowledge is not power, however, the acquisition and appropriate application of knowledge can make you a very powerful individual.