Question

I am trying to make the background image of a webpage go through a slideshow of images, which I’ve managed with:

 <script language="JavaScript1.2">

//Specify background images to slide
var bgslides=new Array()
bgslides[0]="webcam1.jpg"
bgslides[1]="webcam2.jpg"
bgslides[1]="webcam3.jpg"

//Specify interval between slide (in miliseconds)
var speed=5000

//preload images
var processed=new Array()
for (i=0;i<bgslides.length;i++){
processed[i]=new Image()
processed[i].src=bgslides[i]
}

var inc=-1

function slideback(){
if (inc<bgslides.length-1)
inc++
else
inc=0
document.body.background=processed[inc].src
}

if (document.all||document.getElementById)
window.onload=new Function('setInterval("slideback()",speed)')

</script>

which works fine, but then I also want that set of images to be a different set at night-time according to the users timezone. I’ve found this code but I don’t know how to integrate the two persay or if it’s even possible.

 <script type="text/javascript">
var currentTime = new Date().getHours();
if (7 <= currentTime && currentTime < 20) {
    if (document.body) {
        document.body.background = "webcam1.jpg";
    }
}
else {
    if (document.body) {
        document.body.background = "webcam2.jpg";
    }
}

</script>

would appreciate any help, cheers!

Answer 1

Assuming you have a different set of images, you can do this to change your list of images depending on the time of day:

//Specify background images to slide
var bgslides=new Array()

var currentTime = new Date().getHours();
if (7 <= currentTime && currentTime < 20) {
   bgslides[0]="webcam1.jpg"
   bgslides[1]="webcam2.jpg"
   bgslides[2]="webcam3.jpg"
}
else
{
   bgslides[0]="webcam5.jpg"
   bgslides[1]="webcam6.jpg"
   bgslides[2]="webcam7.jpg"
}

//Specify interval between slide (in miliseconds)
var speed=5000

//preload images
var processed=new Array()
for (i=0;i<bgslides.length;i++){
processed[i]=new Image()
processed[i].src=bgslides[i]
}

var inc=-1

function slideback(){
if (inc<bgslides.length-1)
inc++
else
inc=0
document.body.background=processed[inc].src
}

if (document.all||document.getElementById)
window.onload=new Function('setInterval("slideback()",speed)')