Fire-House 58

Event Handlers

onMouseOver
onMouseOut

e-6


JavaScript:
firehouse58.com onMouseOver/onMouseOut event handlers execute script when the mouse cursor passes over and out of an object area.

Hard Reload
To See Menu

pass the mouse over these links

N
O
T
E

The window status property updates when the mouse rolls over a link. The setTimeout("function",n) method is used to delay the action of a particular function or expression by n one-thousandth seconds. In this case, erasing the message.

Test1 Test2

 

<script language="JavaScript">
<!--

onMouseOver
onMouseOut

function over_(msg){
window.status=msg}

This function displays the message string msg passed by each link objects onMouseOver event handler.

function out_(msg){
window.status=msg
setTimeout("gone_()",1500)}

Displays the msg passed by each link objects onMouseOut event handler, then calls the function gone_() after setTimeout 1500 or 1.5 seconds.  

function gone_(){
window.status="";}
// -->
</script>

Redirects the window status to display "" or an empty string. This is done to prevent the status bar from freezing up.

<a href="yourlink"
onMouseOver="over_('Test1'); return true;" onMouseOut="out_(''); return true;">Test1</a>

<a href="yourlink2"
onMouseOver="over_('Test2'); return true;" onMouseOut="out_('See Ya'); return true;">Test2</a>

Each link object uses the event handlers onMouseOver & onMouseOut to call the functions over_ & out_. The string or msg to display on the status bar is passed with the call to the function. The event handlers are directed to return true, to ensure that the status bar is updated. 

These event handlers can be used with area maps, images, and links. They can be used to display text, to activate alerts, to play sound, to call functions, or just about anything you can dream up.

 


[back]   [home]   [next]