简体   繁体   中英

How do I swap a background image on page refresh using localhost?

I need to be able to swap a background image on page refresh. I am attempting to do this with javascript and I'm referencing the id I have set for the body of the page. Here is what I have come up with so far and it doesn't seem to be working:

<script type="text/javascript">
    window.onload = choosePic;

    function choosePic() {
    var myPix = new Array("/CoVPrototype/images/Homepage/skyline_bkgd_blue_fixed.jpg", "/CoVPrototype/images/AboutPage/about_bkgd.jpg", "/CoVPrototype/images/GovernmentPage/gov_bkgd.jpg", "/CoVPrototype/images/newsPage/news_bkgd.jpg", "/CoVPrototype/images/parkPage/park_bkgd.jpg", "/CoVPrototype/images/propertyPage/property_bkgd.jpg", "/CoVPrototype/images/enviroPage/enviro_bkgd.jpg", "/CoVPrototype/images/transportPage/transport_bkgd.jpg", "/CoVPrototype/images/businessPage/business_bkgd.jpg");
    var randomNum = Math.floor(Math.random() * myPix.length);
    document.getElementById("home_style").src = myPix[randomNum];
    }

The tag I'm referencing in the HTML is set like this (please note, all other HTML tags have been applied... just not shown here for the sake of brevity):

<body id="home_style">
</body> 

And finally, my CSS looks like this:

body {
        margin:0;
        padding:0;
        font-size:62.5%;
        font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
}
    body#home_style {
            background:no-repeat bottom left fixed;
            width:100%;
    }

Should this work? What am I doing wrong?! I hope someone can help!!

这应该工作:

document.getElementById("home_style").style.backgroundImage = "url(" + myPix[randomNum] + ")";

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM