Simple Newbie Question

[simontheak]

Hi there,

I'm trying to display a random image that is selected from an array. What's causing the problem is the route to the image that I'm trying to print to the page. I'm sure I'm doing something wrong with escaping characters ... or something!!

Anyway, here's the code

<script language="javascript">
document.write("<img src='images\/" + castlepic[lucky] + "\.gif'" + "width='75' height='70' alt=''></td>";
</script>

castlepic is an array I've declared earlier on in my page and lucky is randomly generated number.

What I'm trying to get is a line that will print out like this:

<img src=images/dog.gif width='75' height='70' alt=''></td>

Can anyone help me at all?

[vgarcia]

You don't have to escape slashes or periods in quotes. Your document.write should look more like this:

<script language="javascript">
document.write("<img src="images/" + castlepic[lucky] + ".gif" + "width='75' height='70' alt=''></td>";
</script>

Although, to be honest I wouldn't use a document.write. Try this script out instead:

<script type="text/javascript">
function setImage(sourceFile) {
  document.getElementById("randomImage").setAttribute("src", sourceFile);
}
</script>

<img id="randomImage" src="/default.gif" alt="Random Image" />

To use it in your current function (the one where you get the value "castlepic[lucky]" from), add this in instead of your document.write:

setImage(castlepic[lucky]);

Using my method above will be more accessible too, since by default there's an image on screen even if JS is disabled. If javascript is enabled, the image will change to the random one, hopefully when the page loads.

Hope this helps!