Changing cell background color [Archive]

bgunwx

03-09-2006, 02:14 PM

I have a webpage that grabs images off of another website and puts them into a table, then changes the images as the user does a mouseover. My question now is, is there a way that I can change the background color of the individual table cell when the images is completely loaded? I'll include a piece of my script that will hopefully help out in assisting me. Thanks!!!!

imgFile=new Array()
imgSrc_a=new Array()
imgFile[0]="http://www.blahblahblah"
imgFile[1]="http://www.blahblahblah"
imgFile[2]="http://www.blahblahblah"
imgFile[3]="http://www.blahblahblah"
imgFile[4]="http://www.blahblahblah""
imgFile[5]="http://www.blahblahblah"
imgFile[6]="http://www.blahblahblah"
imgFile[7]="http://www.blahblahblah"
imgFile[8]="http://www.blahblahblah"
imgFile[9]="http://www.blahblahblah"
imgFile[10]="http://www.blahblahblah"
imgFile[11]="http://www.blahblahblah"
imgFile[12]="http://www.blahblahblah"
imgFile[13]="http://www.blahblahblah"
imgFile[14]="http://www.blahblahblah"
imgSrc_a[0]=new Image();imgSrc_a[0].src=imgFile[0]
imgSrc_a[1]=new Image();imgSrc_a[1].src=imgFile[1]
imgSrc_a[2]=new Image();imgSrc_a[2].src=imgFile[2]
imgSrc_a[3]=new Image();imgSrc_a[3].src=imgFile[3]
imgSrc_a[4]=new Image();imgSrc_a[4].src=imgFile[4]
imgSrc_a[5]=new Image();imgSrc_a[5].src=imgFile[5]
imgSrc_a[6]=new Image();imgSrc_a[6].src=imgFile[6]
imgSrc_a[7]=new Image();imgSrc_a[7].src=imgFile[7]
imgSrc_a[8]=new Image();imgSrc_a[8].src=imgFile[8]
imgSrc_a[9]=new Image();imgSrc_a[9].src=imgFile[9]
imgSrc_a[10]=new Image();imgSrc_a[10].src=imgFile[10]
imgSrc_a[11]=new Image();imgSrc_a[11].src=imgFile[11]
imgSrc_a[12]=new Image();imgSrc_a[12].src=imgFile[12]
imgSrc_a[13]=new Image();imgSrc_a[13].src=imgFile[13]
imgSrc_a[14]=new Image();imgSrc_a[14].src=imgFile[14]

</script>
</head>
<body bgcolor = "black" text="white" link="white" vlink="white" alink="white">

<p align="center"> <font color="white"> </font color="white">
<script>
if (!document.layers)
document.write('<div id="divStayTopLeft" style="position:absolute">')
</script>
<table bgcolor = "black" border="0" width="900">
<tr>
<td width="900">
<p style="margin-top: 0; margin-bottom: -2">

<table><tr><td>NAM 00z 6HR</td><td>&nbsp</td><td>&nbsp</td><td>&nbsp</td><b><td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[0].src >00</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[1].src >06</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[2].src >12</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[3].src >18</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[4].src >24</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[5].src >30</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[6].src >36</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[7].src >42</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[8].src >48</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[9].src >54</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[10].src >60</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[11].src >66</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[12].src >72</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[13].src >78</a></td>
<td align="center"><a href="#picture" onmouseover=document.image1.src=imgSrc_a[14].src >84</a></td>
</tr></table></b>
</p>
</td>
</tr>
</table>
<br>

meth

03-09-2006, 02:40 PM

Q1. Do you have permission to use these other images from the other websites?

Q2. Do you want the background colour to change after the image finishes loading or with the change of image.

With the change of image is easy, after the image has finished loading isn't.

bgunwx

03-09-2006, 03:03 PM

Yes, of course I have permission.

And i would like to have the background change after the image loads so the user knows it is now available.

Thanks

ronaldb66

03-09-2006, 03:14 PM

Isn't the onLoad event handler fired once the page is loaded in it's entirety? You could set the background color with a bit of script then (mind you, I'm not really fluent in JavaScript).

bgunwx

03-09-2006, 03:23 PM

I tried the onload option and put it in right before the mouseover effect in my script. It didn't do a thing for me, so either I inserted it in at the wrong time, or something. I have tried some other options, but am at the end of my html and javascript capabilities, which are fairly limited to begin with.

I am guessing the onload effect didn't work because as soon as it called the onload, the image hadn't loaded yet, and then it was never tested again, so I am assuming some looping will be necessary??? Any help would be great!

Arbitrator

03-09-2006, 04:53 PM

Here's some information that seems to be related to this issue:
http://www.webreference.com/programming/javascript/gr/column3/

meth

03-10-2006, 12:29 AM

Onload isn't an applicable event after the page has completed its initial load. A javascript download event listener sounds like a headache just to change the bg colour. To tell you the truth, I'd go for a flash solution; it'd take less time to code. Javascript would pass the arguements to the flash file and the flash file would fill the parent element. This way, you can use the global functions movieclip events to control your display in any way.