Menu
I searched the forum, and did not find an example for adding text overlays over buttons with the onmouseover/out attribute. The example that I’ve included, changes the button images from grey to red, and it works great. What I need to know, is how to overlay text over these changing images without having to create many gif images with the text labels over them. This would be very time consuming to get the text just right in each image.
Here are the links to the image buttons:
[URL=http://web2.airmail.net/terrycad/Images/GreyBtn200x20.gif]http://web2.airmail.net/terrycad/Images/GreyBtn200x20.gif
[URL=http://web2.airmail.net/terrycad/Images/RedBtn200x20.gif]http://web2.airmail.net/terrycad/Images/RedBtn200x20.gif
[code=html]<html>
<head>
<title>OnMouseButtons</title>
</head>
<body bgcolor=”#000000″>
<a href=”ThisUrl.htm”
onMouseOver=”document.n001.src=’RedBtn200x20.gif’;”
onMouseOut=”document.n001.src=’GreyBtn200x20.gif’;”>
<img src=”GreyBtn200x20.gif” name=”n001″ border=”0″ width=”200″ height=”20″></a><br>
<a href=”ThatUrl.htm”
onMouseOver=”document.n002.src=’RedBtn200x20.gif’;”
onMouseOut=”document.n002.src=’GreyBtn200x20.gif’;”>
<img src=”GreyBtn200x20.gif” name=”n002″ border=”0″ width=”200″ height=”20″></a><br>
<a href=”OtherUrl.htm”
onMouseOver=”document.n003.src=’RedBtn200x20.gif’;”
onMouseOut=”document.n003.src=’GreyBtn200x20.gif’;”>
<img src=”GreyBtn200x20.gif” name=”n003″ border=”0″ width=”200″ height=”20″></a><br>
</body>
</html>