OnLoad and OnMouse JavaScript Events - OnMouseMove
(Page 3 of 6 )
The OnMouseMove event is triggered when the user moves their mouse over a specified area. In the sample below, we use this to change the image. When the user rolls over the text "Move your Mouse Here to Change the Image," the program switches yourimageone to yourimagetwo.
(Note: For this to work in your browser, you must point to actual images in your directory).
<html>
<body>
<img src="youfirstimage.gif" name="mouseover" width="300" height="150">
<p onmousemove="document.images['mouseover']
.src='yoursecondimage.gif'">Move Your Mouse Here to Change the Image.</p>
</body>
</html>
As with OnMouseDown, we could technically use OnMouseMove to ensure people do not steal our images, like so:
<html>
<body>
<img src="yourimage.gif"
onmousemove="alert('Get your own images!')" />
</body>
</html>
Supporting HTML tags: <a>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, <button>, <caption>, <cite>, <code>, <dd>, <dfn>, <div>, <dl>, <dt>, <em>, <fieldset>, <form>, <h1> to <h6>, <hr>, <i>, <img>, <input>, <kbd>, <label>, <legend>, <li>, <map>, <ol>, <p>, <pre>, <samp>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, <th>, <thead>, <tr>, <tt>, <ul>, <var>
Supporting Javascript Objects: Not supported
Next: OnMouseOut >>
More JavaScript Articles
More By James Payne
/ 5 
