Status Bar Messages


What normally happens when you place the cursor over a link? The file location of the link is displayed in the status bar at the bottom of the page. When the cursor leaves the link, the displayed text disappears from the status bar.

Example- of normal Place your cursor here and look at the status bar at the bottom of the page; displays the file's location. Remove the cursor from the link; display is blank.

Below are a few options on how to change the way the link is displayed in the status bar. Note: using either of the first two methods below, once invoked, will change how the return works for all the non scripted links. The last method returns the display to a more normal appearance.

return false method

Example - return false

<a href="javascript-index.htm" onMouseOver="window.status='You can change this text to what you want'; return false">Example - return false</a>

As you can see from the inline javascript above, this script uses the onMouseOver event to trigger what happens to the display in the status bar at the bottom of the page. When you place the cursor over the link above, the status bar will display the file location. When the cursor then is moved off of the link whatever is written in the red text location will appear in the status bar. Placing the cursor on and off the link will cause the effect to repeat itself.

return true method

Example - return true

<a href="javascript-index.htm" onMouseOver="window.status='Another way of doing it'; return true">Example - return true</a>

Another way to display text in the status bar is using the return true method. When the cursor touches a link, the message you want to display in the status bar will appear immediately. It will remain when the cursor leaves the link. The file location information does not appear at any time. In the false method the file location was given first and when the cursor left the link then the message was displayed.

preferred method

Here is a script that you can use if you want to keep the status bar acting a little closer to normal by having the text disappear from the status bar after the cursor has left the link.

Example - of double

<a href="javascript-index.htm" onMouseOver="window.status='What I think is the best method'; return true" onMouseOut="window.status=' '; return true">Example - of double</a>

As you can see from the inline script above, an onMouseOut event has been added to the anchor tag. It still uses the return true method for the onMouseOver event and also for the onMouseOut event. Here is what happens. When the cursor is placed over the link the message you want to display immediately appears in the status bar. This has not changed from the method above. What is different is that when the cursor leaves the link the status bar appears to returns to normal, displaying a blank. This is achieved by leaving the text field blank in the onMouseOut event. No text appears between the single quotes in the script.

Hope that this helps you...

Author: Joseph Raymond

25th of March, 2001