Replace image with JavaScript on timer

Question

I am really new to JavaScript and working on a project to replace an image every 5 seconds without using a onClick command.

The first function startAdPage should start when the page loads, allowing the setInterval commands inside that function to begin. Once the changeAd function starts it is supposed to replace the image in the table with the matching id.

I would really appreciate some advice. Some that may be a problem which I am not sure about is I have the Javascript contained in the body of my document, but the onLoad at the start of the body. Is that an issue as well?

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>CVR1</title>
</head>
<body onLoad="startAdPage()">
<script type="text/javascript">
/* <![CDATA[ */
function startAdPage() {
	setInterval(changAd,5000);
}
function changeAd() { 
	//THIS NEEDS WORK should change the image every 5 seconds to replace the one in the table
	document.getElementById("adImage").src = images[index];
	index = (index + 1) % images.length;
}
/* ]]> */
</script>
<table>
  <tr>
    <td><img id="adImage" src="pictures/cvb1.gif" ></td>
    <td><p>Advertisement</p><p>The Central Vally Realtors home page will be displayed in TEXTFIELD seconds.</p><p><a href="CVR2.html">Skip Advertisement</a></p></td> 
  </tr>
</table>
</body>
</html>

You never initialized index to 0. And where is the definition of images? — Barmar
– Barmar, Commented Oct 17, 2014 at 6:29

MrCode · Accepted Answer · 2014-10-17 06:28:58Z

3

On this line:

setInterval(changAd,5000);

changAd should be changeAd

Remember to press F12 and check the console for errors, you have:

Uncaught ReferenceError: changAd is not defined

As the comments show there also seem to be other essential parts missing: the images array and index is undefined.

var index = 0;

var images = [
    'image1.png',
    'image2.png'
];

answered Oct 17, 2014 at 6:28

MrCode

64.6k10 gold badges95 silver badges114 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Replace image with JavaScript on timer

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related