[Javascript] Image swapping on a layer

Brian Maule soaked at pacbell.net
Wed Apr 18 16:39:28 CDT 2001


I'm trying to layer a few images, with the top image being part of a mouseover image swap. I've been able to successfully,  in both IE and NS, position and layer the images using z-index and abs position (see snippet below). However, the image swap is non-functional in NS.
Also, please note, this a double image swap; one for the mouseover image ('a'), and one for another image ('pic').

What am I missing? What is NS expecting that I haven't provided?

Thanks in advance,
Brian

************************

<SPAN ID="dog1" STYLE="position:absolute;">
<a href="treetest.html" onMouseOver="hiLite('pic','pic2','a','a2');
window.status='Button 1';return true;"
onMouseOut="hiLite('pic','pic1','a','a1'); window.status='';return true;"
onclick="window.focus()"><img SRC="resources.gif" NAME="a" ALT="Button 1"
BORDER=0 height=24 width=120></a>;
</SPAN>

<SPAN ID="dogtree" STYLE="position:absolute;">
<img src="treehomemain.jpg" name="pic" width="243" height="218" alt="Tree" border="0">
</SPAN>

<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript">
<!--

if (document.all) {
    document.all('dog1').style.posLeft = 20;
    document.all('dog1').style.posTop = 10;
    document.all('dog1').style.zIndex = 30;
}
else if (document.layers) {
    document.layers['dog1'].left = 20;
    document.layers['dog1'].top = 10;
    document.layers['dog1'].zIndex = 30;

if (document.images)  {

      pic1 = new Image(243,218);
      pic1.src = "treehomemain.jpg";
      pic2 = new Image(243,218);
      pic2.src = "treehomea.jpg";

      a1 = new Image(120,24);
      a1.src = "resources.gif";
      a2 = new Image(120,24);
      a2.src = "resourcesb.gif";
}

function hiLite(imgDocID, imgObjName, imgDocID2, imgObjName2)  {
        document.images[imgDocID].src = eval(imgObjName + ".src");
        document.images[imgDocID2].src = eval(imgObjName2 + ".src");
}
**********************
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.evolt.org/pipermail/javascript/attachments/20010418/9974351c/attachment.htm>


More information about the Javascript mailing list