Working with timers

Working with timers

You know already the onMouseOver- property from part 2 of my tutorial:

Don't you hate it that the statusbar does not erase the text when the mousepointer does not point on the link any longer? I have quite a simple solution. We just write a small function which uses the same technique to erase the statusbar as shown above. But how can the erase- function be called? We don't have a method or property which we can use for detecting if the mouse pointer is moving from a link. Setting a timer is the solution.

link

You will recognize many parts of this script. The moveover(txt) function is just the statbar(txt) function after some copy/paste work on it! Nearly the same happend to the erase() function. In the of the HTML- page we create a link with the known onMouseOver- property. Our moveover(txt) function is called with the string 'Disappearing!' being passed over to the txt variable. The window.status gets the contents of txt. This the same thing as in the statbar(txt) function. The setTimeout(...) function call is new though.

This function sets a timeout. Who was expecting this? The setTimeout(...) function defines how long the timer is going to run and what will happen when the time is over. In our example the erase() function is called after 1000 milliseconds (that's a second for all math- cracks out there). This is a phantastic feature! Your function moveover(txt) function is finished after the timer is set. The browser calls the function erase() automatically after 1 second. (Already thinking of a page telling the user: If you don't do this your harddrive is going to be destroyed in 10 seconds! ???) After the timeout is finished the timer does not restart again. But you could of course call it again in the erase() function. This leads us directly to the all-over liked scrollers.