Designing with JavaScript CD Code

<HTML>
<HEAD><TITLE>Two Birds, One Stone: Multiple Rollovers</TITLE>
<SCRIPT LANGUAGE = "JavaScript">
<!--

bName = navigator.appName;
bVer = parseInt(navigator.appVersion);
    if ((bName == "Netscape" && bVer >= 3) || 
        (bName == "Microsoft Internet Explorer" && bVer >= 4)) br = "n3"; 
    else br = "n2";
    
    if (br== "n3") {
    img1on = new Image();          
    img1on.src = "newson.gif";       // Active News Image
    img2on = new Image(); 
    img2on.src = "productson.gif";   // Active Products Image

    img1off = new Image();         
    img1off.src = "newsoff.gif";     // Inactive News Image
    img2off = new Image(); 
    img2off.src = "productsoff.gif"; // Inactive Products Image

    img1ad = new Image();         
    img1ad.src = "newstip.gif";      // Secondary News Image 
    img2ad = new Image();
    img2ad.src = "productstip.gif";  // Secondary Products Image
    }

function imgAct(imgName) {
    if (br== "n3") {
    document[imgName].src = eval(imgName + "on.src");
    document["holder"].src = eval(imgName + "ad.src");
    }
}

function imgInact(imgName) {
    if (br== "n3") {
    document[imgName].src = eval(imgName + "off.src");
    document["holder"].src = "clear.gif";
    }
}

// -->
</SCRIPT>
</HEAD>
<BODY BGCOLOR = "#FFFFFF">

<!-- News Rollover -->
<A HREF = "catalog.html" 
 onMouseOver = "imgAct('img1')"    
 onMouseOut = "imgInact('img1')">
<IMG NAME= "img1" BORDER = 0 HEIGHT = 19 WIDTH = 93 SRC = "newsoff.gif"></A>

<!-- Products Rollover -->
<A HREF = "catalog.html" 
 onMouseOver = "imgAct('img2')"    
 onMouseOut = "imgInact('img2')">
<IMG NAME= "img2" BORDER = 0 HEIGHT = 19 WIDTH = 84 SRC = "productsoff.gif"></A>

<!-- Placeholder Image -->
<IMG NAME = "holder" HEIGHT = 17 WIDTH  = 600 SRC = "clear.gif">

</BODY>
</html>