Place your mouse over a color listed below. It will change the font color of the text on the page.
Note: this effect works in IE browsers. Netscape users, sorry, them's the breaks. This brings up an important point; no matter how hard you try to make your scripts cross browser friendly, they won't always work. At times the problem may not be the scripts but the supported properties.
Red |
Orange |
Green |
Turquoise |
Blue |
Black |
This was done by writing the script below into the head of the document. After that was done, it was only a matter of referring each of the elements to fire the particular color they are named for with an inline call. See below the script for the example.
<script language="javascript"
type="text/javascript"><!--
function red()
{
document.fgColor ="#FF0000"
}
function orange()
{
document.fgColor="#ffa500"
}
function green()
{
document.fgColor="#006400"
}
function turquoise()
{
document.fgColor="#00ced1"
}
function blue()
{
document.fgColor="#0000FF"
}
function black()
{
document.fgColor="#000000"
}
// --></script>
As you can see from above the one script tag holds six functions. Each has its own unique function name. The way they were referenced is listed below.
<center><table><tr><td>
<h3
onMouseOver="red()">Red</h3></td><td>
<h3
onMouseOver="orange()">Orange</h3></td><td>
<h3
onMouseOver="green()">Green</h3></td><td>
<h3
onMouseOver="turquoise()">Turquoise</h3></td><td>
<h3
onMouseOver="blue()">Blue</h3></td>
<h3
onMouseOver="black()">black</h3></td><td>
</tr></table></center>
Hope that this helps you...
Author: Joseph Raymond
27th of March, 2001