Ken Ward's JavaScript Tutorial 2

Ken Ward's New Java Script Tutorial

On mouse over events

This page explains how to use the onMouseOver event. It also mentions that these can be annoying!


Put your mouse over the following word:

cat

You should have seen an alert box appear when your mouse went over the word. The code is as follows:

<a href="#" onmouseover="alert('Mmm! Mices! Yum. Yum')">

cat

</a>

Yes, that's all! But look more closely. Did you notice that we start with double quotes (") and put the text in the alert in single quotes (') ? And we ended with a double quote.


exclam.gif (342 bytes) Any text between a " (or a ' ) and its matching quote (") must be on one line! So the text above:

'Mmm! Mices! Yum Yum'

Must be on one line and not split into two lines. Because of text wrapping, these lines could appear broken. This will give an error. So:

onmouseover="alert('Mmm! Mices! Yum.
Yum')
"

is wrapped by the browser and will give an error. The quotation (") begins on one line and ends on another. This is not allowed by JavaScript! It is called a broken string. 


The onMouseOver event is enclosed in  double quotes. If we used double quotes for the text too, we would confuse java script so it would think the onMouseOver event had ended when we started the text - after all, it had found its matching quote! The start and end quotes must match up!So we enclose the text in singles, and the event in doubles! The quotes must match up!

Alternatively, we could have used single quotes for the onMouseOver event and double for the text. We just have to keep the right quotes paired up!


We could use an onMouseOver event with a menu, loading a description page in a frame, for example. Or we could use an image and have an onMouseOver for the hot spots! We'll look at these a bit later.

Let's look at writing with java script next.



[If you need to learn more about HTML visit the HTML Tutorial]

I am always pleased to hear from you.
Send your comments to