Q236 How can I show a different image each day?

You are here: irt.org | FAQ | JavaScript | Image | Q236 [ previous next ]

What we need is some mechanism to choose the image to be displayed. The following script will always show 1.jpg:

<script language="JavaScript"><!--
document.write('<img src="images/' + 1 + '.jpg">');
//--></script>

This is similar to:

<script language="JavaScript"><!--
var number = 1;
document.write('<img src="images/' + number + '.jpg">');
//--></script>

Now all we need to do is alter the value of the number. It would be easier if you had seven different images. That way we can display a different image for each day of the week:

<script language="JavaScript"><!--
var today = new Date();
var number = today.getDay() + 1;
document.write('<img src="images/' + number + '.jpg">');
//--></script>

This creates a date object and then gets the number of the day of the week, and then uses that to display the relevant image.

If you have more than 7 images then you'll need to alter this, either using the day of the month or the day of the year, or maybe even the day of the millennium!

©2018 Martin Webb