www.webdeveloper.com
Results 1 to 3 of 3

Thread: Change background image with java script?

  1. #1
    Join Date
    Feb 2005
    Location
    Sweden
    Posts
    29

    Question Change background image with java script?

    Hi there!

    I'm working with a homepage, and I wonder if it possible to change the picture in the background tags <body background="image"> with a java script like a script that swapps picture with the image()object?

    I'm looking forwar to get some answers!

    Nyfiken

  2. #2
    Join Date
    Sep 2004
    Location
    Midwest
    Posts
    1,629
    Random background image:
    <HTML>
    <Head>
    <Script Language=JavaScript>

    var bgImage = new Array();
    bgImage[0] = "graybars.gif"
    bgImage[1] = "clouds.jpg"
    bgImage[2] = "blue bars.gif"

    isMax = bgImage.length-1;
    currImg = 0+Math.round(Math.random()*isMax);

    window.onload=function(){

    isImg = bgImage[currImg];
    document.body.style.backgroundImage = "url("+isImg+")"
    }

    </Script>
    </Head>
    <Body>

    </Body>
    </HTML>

    ----------------
    Button change background image:
    <HTML>
    <Head>
    <Script Language=JavaScript>

    function changeBGImg(isBG){

    document.body.style.backgroundImage = "url("+isBG+")"
    }

    </Script>
    </Head>
    <Body>
    <input type=button value="Change Background" onclick="changeBGImg('vertbluebars.gif')">
    </Body>
    </HTML>

  3. #3
    Join Date
    Jan 2014
    Posts
    1
    Quote Originally Posted by Warren86 View Post
    Random background image:
    <HTML>
    <Head>
    <Script Language=JavaScript>

    var bgImage = new Array();
    bgImage[0] = "graybars.gif"
    bgImage[1] = "clouds.jpg"
    bgImage[2] = "blue bars.gif"

    isMax = bgImage.length-1;
    currImg = 0+Math.round(Math.random()*isMax);

    window.onload=function(){

    isImg = bgImage[currImg];
    document.body.style.backgroundImage = "url("+isImg+")"
    }

    </Script>
    </Head>
    <Body>

    </Body>
    </HTML>

    ----------------
    Button change background image:
    <HTML>
    <Head>
    <Script Language=JavaScript>

    function changeBGImg(isBG){

    document.body.style.backgroundImage = "url("+isBG+")"
    }

    </Script>
    </Head>
    <Body>
    <input type=button value="Change Background" onclick="changeBGImg('vertbluebars.gif')">
    </Body>
    </HTML>
    ***************************

    sorry to bring up this old thread,is there any way to store a cookie on click to remember this selection?

    any help on this is greatly appreciated.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles