Status Property and the return Keyword

A description of this link appears in the browser's status bar

The text link above demonstrates how to use the status property of the window object to communicate a message about the link to the user. Move your mouse over the link and look at the status bar below.

For NN 4.x and MSIE browsers, a simple status statement contained within the onmouseover and onmouseout event handlers was enough to manipulate the text shown in the window's status bar:

<a href="http://www.yahoo.com" onmouseover="window.status='Yahoo Home Page';return true" onMouseOut="window.status=''">A description of this link appears in the browser's status bar</a>
But because of a timing problem with those events firing in NN 6.x, a fix using a setTimeout statement containing the simple status statements is required. To keep our code nice and neat, we'll place the statements in a function rather than within the event handlers:
function onOver(){
setTimeout("status='Trying to Leave?'",0)
return true
}

function onOut(){
setTimeout("status=''",0)
return true
}

<a href="http://www.yahoo.com" onmouseover="return onOver()" onMouseOut="return onOut()">A description of this link appears in the browser's status bar</a>


Notice the return keyword following the setTimeout statement in the onOver() function. This is used because by setting text to the window's status bar, we are interrupting the browser's natural behavior of displaying the link's URL when the mouse moves over a link. The return keyword precedes the function call in the event handler because the true value ultimately needs to be returned to the browser.

Since some browsers display something like, "document done" as the default status text, we're using the return true statement with the onOut() function as well.


View the Source