chestertb
10-30-2003, 07:17 AM
Hi all...
Have ventured, finally, into the depths of positioned elements and want to overlay two pics, with the hidden top pic revealed in segments according to an image map on mouseover.
For this, I am trying to use
function over(w)
{
document.all.subs.style.clip=(0 48 33 0);
}
which is trying to reveal a portion of the hidden top image 33 high by 48 wide.
The html is as follows;
<DIV id="subn" STYLE="position:relative;left:50px;top:30px;z-index:-1">-
<img border="0" src="images/labels/ms1.gif" style="position:absolute; left:0px; top:0px" usemap="#bmap" width="49" height="198"></p>
</DIV>
<DIV id="subs" STYLE="position:relative;left:50px;top:30px;z-index:1; visibility:hidden">
<img border="0" src="images/labels/ms1s.gif" style="position:absolute; left:0px; top:0px" usemap="#bmap" width="49" height="198"></p>
</DIV>
Note that the image map aligns with the 33x48 box in the clip, and contains onmouseover="over('1')".
Onmousover, it returns w to the function but the image does not change. Am I on the right track here, or have I totally misinterpreted the javascript/dhtml references?
Thanks
IB
Have ventured, finally, into the depths of positioned elements and want to overlay two pics, with the hidden top pic revealed in segments according to an image map on mouseover.
For this, I am trying to use
function over(w)
{
document.all.subs.style.clip=(0 48 33 0);
}
which is trying to reveal a portion of the hidden top image 33 high by 48 wide.
The html is as follows;
<DIV id="subn" STYLE="position:relative;left:50px;top:30px;z-index:-1">-
<img border="0" src="images/labels/ms1.gif" style="position:absolute; left:0px; top:0px" usemap="#bmap" width="49" height="198"></p>
</DIV>
<DIV id="subs" STYLE="position:relative;left:50px;top:30px;z-index:1; visibility:hidden">
<img border="0" src="images/labels/ms1s.gif" style="position:absolute; left:0px; top:0px" usemap="#bmap" width="49" height="198"></p>
</DIV>
Note that the image map aligns with the 33x48 box in the clip, and contains onmouseover="over('1')".
Onmousover, it returns w to the function but the image does not change. Am I on the right track here, or have I totally misinterpreted the javascript/dhtml references?
Thanks
IB