| home / experts / dhtml / column1 |
 
|
|
We've tightened up the code by introducing variables in the functions, and put all the component parts in the correct order that they should appear in the document.
<HEAD>
.
.
.
<SCRIPT LANGUAGE="JavaScript">
<!--
ver4 = (document.layers || document.all) ? 1 : 0;
if (document.images) {
arImageSrc = new Array (
"imButdown.gif",
"imButup.gif",
"imButthis.jpg",
.
.
.
"../images/imButthat.jpg" )
arImageList = new Array ();
for (counter in arImageSrc) {
arImageList[counter] = new Image();
arImageList[counter].src = arImageSrc[counter];
}
};
function rollOver(imName,over) {
if (!document.images) {return};
whichIm = document.images[imName];
if (over) { whichIm.src = imName + "over.gif" }
else { whichIm.src = imName + "up.gif" };
}
function rollClick(imName) {
if (!document.images || ver4) {return};
whichIm = document.images[imName];
whichIm.src = imName + "down.gif";
dummy = setTimeout("whichIm.src = \"" + imName + "over.gif\"",100);
}
function rollPress(imName,down) {
whichIm = document.images[imName];
if (down) { whichIm.src = imName + "down.gif" }
else { whichIm.src = imName + "over.gif" }
}
//-->
</SCRIPT>
.
.
.
</HEAD>
<BODY>
.
.
.
<A HREF="yourlinkgoeshere.html"
onMouseOver = "rollOver('imBut',true)"
onMouseOut = "rollOver('imBut',false)"
onMouseDown = "rollPress('imBut',true)"
onMouseUp = "rollPress('imBut',false)"
onClick = "rollClick('imBut')">
<IMG NAME="imBut" SRC="imButup.gif" WIDTH=62 HEIGHT=28 BORDER=0></A>
After a break, next column, for CSS positioning, we will continue our look at the new scripting event handlers, for it is mostly response to events that makes the new HTML Dynamic.
Produced by Peter Belesis and
Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia
Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Tech Jobs | Shopping | E-mail Offers
All Rights Reserved. Legal Notices.
Created: 07/23/97
Revised: 09/28/97
URL: http://www.webreference.com/dhtml/column1/allcode.html
