How to change the font and background color of a page element when the mouse passes over it, using the onMouseOver and onMouseOut events.
Move Mouse here for Demo
<script language="javascript">
function Swap(Cell){
switch (Cell.style.color){
case "":
{
Cell.style.color="yellow"
Cell.style.background="red"
}
break
case "yellow":
{
Cell.style.color=""
Cell.style.background="none"
}
break
default:
Cell.style.display = "none"
}
}
</script>
<!--the id is required to create and enable the DHTML element-->
<span id="C1"
onMouseOver="Swap(this)" onMouseOut="Swap(this)"><font
face="Arial" style="cursor:hand"><b>Mouse
Roll-Over Test Area</b></font></span>
<!--Cell.style.color Sets the font color-->
<!--Cell.style.background sets the background
color-->
<!--style="cursor:hand" changes the cursor
to the Hand icon-->
Last Updated: 10/9/2019