Question

I have a code to randomize a background-image in a div element upon page load, however it doesn’t seem to be working.

JS in the section:

function Randomize() {
    var images = new Array("<?php echo SITE_URL?>/lib/skins/flyeuro/images/banners/ban.ner1.jpg","<?php echo SITE_URL?>/lib/skins/flyeuro/images/banners/banner2.jpg");
    var imageNum = Math.floor(Math.random() * images.length);
    document.getElementById("banner").style.backgroundImage = "url('" + images[imageNum] + "') repeat scroll center center rgb(0, 0, 0)";
}

window.onload = Randomize;

HTML:

<div id="banner"></div>

CSS:

div#banner {
    background: url("../images/banners/banner1.jpg");
    width: 100%;
    height: 270px;
    z-index: 1;
    margin-bottom: 25px; 
    -webkit-box-shadow:  0px 2px 15px 2px ;
    box-shadow: 0px 2px 15px 2px ;
}

Answer 1

You’re setting multiple background attributes to the backgroundImage property. Instead, just set a url().

If you want to always have those other values, I’d set them in the CSS.

jsFiddle.