Simple onmouseover by Jonathan Green.

Move your mouse over the link above!

You saw this script earlier and it was VERY successful. Well, I've gone one better! Fill in the form below to create your very own onmouseover scripts. You need no HTML or javascript experience whatsoever! It is so simple!

Make your very own onmouseovers!

To make your own onmouseovers, simply fill in the form below!

Image 1:

Image 2:

Link name (must be different from any other link name on the same page):

Destination:

Email me for whatever reason at
[email protected].

Visit my web site at
http://the-java-nest.pyar.com
for more simple and easy to use javascripts.

"); } //-->

Okay, you like the script, but how does it work?

A typical onMouseOver script: <HTML>  <HEAD> <TITLE>Title of document</TITLE> </HEAD> <BODY><script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-47423994-1', 'fortunecity.ws'); ga('send', 'pageview'); </script> <center> <br> <div> <script language="javascript" type="text/javascript" src="http://ad.broadcaststation.net/ads/show_ad.php?width=728&height=90"></script> </div> </center> <a href="linktopage.htm" onMouseOver="document.link1.src='picture2.gif'" onMouseOut="document.link1.src='picture1.gif'"> <img src="picture1.html" name="link1"> </a> <a href="linktopage.htm" onMouseOver="document.link2.src='picture4.gif'" onMouseOut="document.link2.src='picture3.gif'"> <img src="picture3.html" name="link2"> </a> </BODY>  <center> <div> <br> <script language="javascript" type="text/javascript" src="http://ad.broadcaststation.net/ads/show_ad.php?width=300&height=250&cache=0"></script> <script language="javascript" type="text/javascript" src="http://ad.broadcaststation.net/ads/show_ad.php?width=300&height=250"></script> </div> <br> <br> </center> </HTML>

I have shown the tags differently here, so it is easier to understand.

If you ignore the onMouseOver and onMouseOut parts, you see just an ordinary image link. We name the image "link1". We could call this image anything, but I think link1 is relevant. So the image is called link1.

The onMouseOver=" " command tells the browser that when the mouse moves over whatever is between the <a href...... and </a>, to do what is between the " and " (which are next to the onMouseOver command). In this case this is between the " and ":

document.link1.src='picture2.gif'

Link1 is the name of the image that is being referred to. The src means source. So when the mouse moves over link1 which is in the current document, the src (source) of the image will change to what is after the = symbol.

This is exactly the same for the onMouseOut command, apart from it refers to when you move the mouse cursor off of the image.

I hope that this page has helped you all.

Best regards,
Jonathan Green.

Email: [email protected]
Web site: the-java-nest.pyar.com