spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / experts / dhtml / column1
Developer News
News Flash: Adobe Has iPhone Workaround
Adobe's Flash 10.1 Goes Mobile (Minus iPhone)
A Salute to Visionary CEOs

Logo

TheRollover-Click Effect:
SPECIAL EDITION; the director's cut

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>

More Event Handlers

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

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Building a Banking Application Home Page with OOP · Mixing Scripting Languages · Review: phpFox, a Social Networking CMS with all the Bells and Whistles
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Enterprise 2.0: Social Networking in the Cloud · BroadSoft Marketplace Hastens Pace of Telephony Innovation · Review: HTC Hero for Sprint

All Rights Reserved. Legal Notices.
Created: 07/23/97
Revised: 09/28/97

URL: http://www.webreference.com/dhtml/column1/allcode.html