table cell with random background

[davikokar]

hi,

I am trying to have a table cell with a random image as background. The random image would be chose among four possible images.

I am using this code but it doesn't work:

<script language="javascript" type="text/javascript">
var img_rnd = new Array ();

img_rnd[0] = "img/background_index_01.jpg";
img_rnd[0] = "img/background_index_02.jpg";
img_rnd[0] = "img/background_index_03.jpg";
img_rnd[0] = "img/background_index_04.jpg";

var i = Math.floor(Math.random() * 4);

document.getElementById('back').bg=img_rnd[i];
//-->
</script>

and then of course the html:

<td class="index_bottom" id="back" name="back">

do you see any mistake?
thanks

 

[BillyRayPreachersSon]

Maybe because you've only got one image - you're setting img_rnd[[!]0[/!]] every time!

Dan

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[davikokar]

ehm.... yes... a part from this error, the debugger still tell me that

document.getElementById('back').bg=img_rnd;

is null or not an object...

any idea?
thanks

 

[BillyRayPreachersSon]

That's because it isn't. "bg" is not a property of any HTML objects. Read up on the "background-image" CSS property.

Hope this helps,
Dan



[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[davikokar]

yes, normallyw ith css I would use the background-image property to set a background of a cell. But when it comes to javascript... I don't know how to refer to it:

bg ?
background ?
background-image ?

none of these worked.

By the way... do you know a knowledge base for javascript. Something similar to the one that Microsoft produced for VB.NET... where all objects are listed with all properties, and so on...?

thanks for the help

 

[tsuji]

To refere to it in javascript, use this.
[tt]document.getElementById("back").style.backgroundImage[/tt]

 

[davikokar]

thanks for the answers...
I am trying with this code, updated with your suggestion. But I still get an error message "object required" on the line with the document.getElementByID....

<script language="javascript" type="text/javascript">
var img_rnd = new Array ();

img_rnd[0] = "img/background_index_01.jpg";
img_rnd[1] = "img/background_index_02.jpg";
img_rnd[2] = "img/background_index_03.jpg";
img_rnd[3] = "img/background_index_04.jpg";

var i = Math.floor(Math.random() * 4);

document.getElementById("back").style.backgroundImage=img_rnd[i];

//-->
</script>

 

[tsuji]

Like this.
[tt] document.getElementById("back").style.backgroundImage=[red]"url([/red]img_rnd[red])"[/red];
[/tt]

 

[davikokar]

mah... this still gives me the same error.... I am sure the pictures exist in the right place. what else can be?

 

[tsuji]

My mistake. Your path is a variable. Here is the amendment.
[tt]
document.getElementById("back").style.backgroundImage=[red]"url("+[/red]img_rnd[red]+")"[/red];
[/tt]