Using Javascript to rotate images with the style.backgroundImage property & I leave the onload pg & return, the images have trouble loading.

Question

I'm using Javascript to rotate background images -->
function rotateImages() {
setInterval("startRotator()", 7000);
var counter = 0;
function startRotator() {
var images = ["images/finance1.jpg","images/finance2.jpg","images/finance3.jpg","images/finance4.jpg","images/finance5.jpg","images/finance6.jpg"];
if( counter >= images.length ) {
counter = 0;
var image = "url('" + images[counter] + "')";
counter++;
document.body.style.backgroundImage=image;
The script is triggered by the load event when the homepage loads and the script only runs on the homepage. Everything works fine upon opening the homepage.
If I leave the home page and return, the images will have trouble loading for about 3 to 5 cycles and I'll get white backgrounds for part of the time. The same thing happens if I enter the site from a page other than the homepage and then go to the homepage.
I discovered, however, that if I enter the site at the homepage and then leave the homepage and return using the back button, everything runs fine. Apparently it then accesses a cached version of the homepage? Seems having two cached versions creates a conflict?
This problem only happens with Firefox (I have ver 29.0.1). It does not happen on IE ver 11, Chrome ver 34, or Safari ver 5.1.7.
I get the same problem with XP, Win7, and Win8 but, only on Firefox.
Can you please fix this?

Answer 1

Hey, I am trying to reproduce this here: [http://jsfiddle.net/u3TLb/]
Mozillazine forums and the [http://webcompat.com] are more specialized in Web Compatibility, please ask there as well.