Hi there, I am currently working with a javascript background script that changes the background on a timer and and in reference to day and night this works great but I'm trying to make the background stretch to 100% of the browser width, I've done this through CSS. It works in safari and chrome but not firefox (maybe IE too) instead it see's the 100% as showing the image at 100% of it's size....
the basic javascript is this:
Code:<script language="JavaScript1.2"> //Specify background images to slide var bgslides=new Array() var currentTime = new Date().getHours(); if (9 <= currentTime && currentTime < 18) { bgslides[0]="images/webcam1.jpg" bgslides[1]="images/webcam2.jpg" bgslides[2]="images/webcam3.jpg" } else { bgslides[0]="images/webcamnight.jpg" bgslides[1]="images/webcamnight.jpg" bgslides[2]="images/webcamnight.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)') window.onload=new Function('setInterval("slideback()",speed)') </script>
but then I decided it might be easier to write to a div to control the background so like this:
andCode:<style type="text/css"> body, html { margin: 0; padding: 0 } #bgimg { position:absolute; z-index:-1; width:100%; height:100% } </style>
Code:<img id="bgimg" src="startingimage.gif" />
but I now need to write in the javascript so that it sends to the bgimg appose to the background, I've had a go but can't get it to work can anybody help?
Here's what I've tried but I think I'm doing somthing wrong..
Code:function slideback(){ if (inc<bgslides.length-1) inc++ else inc=0 document.getElementById('bgimg')=processed[inc].src



Reply With Quote
Bookmarks