stilsen
08-27-2006, 01:03 AM
1. I set up the following three images, one of which is in a table,
in the body:
<img></img>
<img></img>
<table align="center" width="100%" style="vertical-align:top;">
<tr style="vertical-align:top">
<td width="15%"><img src="./images/gif1.gif"></img></td>
</tr>
</table>
2. then i set source, position, size, and zIndex attributes of the first two images. zIndex works between these two if I change it either way.
<script language="javascript">
document.images[0].src="./images/s1.gif";
document.images[0].width=25;
document.images[0].height=25;
document.images[0].style.position="absolute";
document.images[0].style.left=100;
document.images[0].style.top=100;
document.images[0].style.zIndex=0;
document.images[1].src="./images/s2.gif";
document.images[1].width=25;
document.images[1].height=25;
document.images[1].style.position="absolute";
document.images[1].style.left=110;
document.images[1].style.top=110;
document.images[1].style.zIndex=0;
3. but when it comes to trying to get the first two images to be hidden behind the third, which is in a table, i cant figure out how to make it work. none of the following works.
var mytables = document.getElementsByTagName("table");
mytables[0].style.zIndex="2";
mytables[0].cells[0].style.zIndex="2";
mytables[0].rows[0].style.zIndex="2";
mytables[0].cols[0].style.zIndex="2";
document.images[2].style.zIndex=2;
what am i doing wrong?
thanks,
st
in the body:
<img></img>
<img></img>
<table align="center" width="100%" style="vertical-align:top;">
<tr style="vertical-align:top">
<td width="15%"><img src="./images/gif1.gif"></img></td>
</tr>
</table>
2. then i set source, position, size, and zIndex attributes of the first two images. zIndex works between these two if I change it either way.
<script language="javascript">
document.images[0].src="./images/s1.gif";
document.images[0].width=25;
document.images[0].height=25;
document.images[0].style.position="absolute";
document.images[0].style.left=100;
document.images[0].style.top=100;
document.images[0].style.zIndex=0;
document.images[1].src="./images/s2.gif";
document.images[1].width=25;
document.images[1].height=25;
document.images[1].style.position="absolute";
document.images[1].style.left=110;
document.images[1].style.top=110;
document.images[1].style.zIndex=0;
3. but when it comes to trying to get the first two images to be hidden behind the third, which is in a table, i cant figure out how to make it work. none of the following works.
var mytables = document.getElementsByTagName("table");
mytables[0].style.zIndex="2";
mytables[0].cells[0].style.zIndex="2";
mytables[0].rows[0].style.zIndex="2";
mytables[0].cols[0].style.zIndex="2";
document.images[2].style.zIndex=2;
what am i doing wrong?
thanks,
st