Halved Background Image

Started by Gryffin, October 23, 2011, 04:04:55 PM

Gryffin

Hello,
I've just finished my website. But my random background images load properly sometimes, and sometimes they load as a half.
Here is my website:
http://www.finnhaverkamp.com/

Here is the relevant HTML:

<!--open random background script-->
<script  type="text/javascript">

var randnum = Math.random();
var inum = 7;
var rand1 = Math.round(randnum * (inum-1)) + 1;
var images = new Array;
images[1] = "background1.jpg";
images[2] = "background2.jpg";
images[3] = "background3.jpg";
images[4] = "background4.jpg";
images[5] = "background5.jpg";
images[6] = "background6.jpg";
images[7] = "background7.jpg";
var image = images[rand1];


function chBackgr()
{
    document.body.style.backgroundImage = 'url(' + image + ')';
}

onload = chBackgr;
<!--close random background script-->


It's weird. Because my background image is certainly random. It's just that sometimes only half of the image loads. Really strange. Any help is appreciated. Thank You.

lillianabe

It seems that toy have tried out some kind of experiment to design your website there are lots of changes are required to make the design of your website perfect. My suggestion is to use any free web template which no. of images you want to display and set all images as per template setting which would do the fine job.

JacksonWaugh

I don't know why you get half images, but I can tell you that your randomizing is broken.

Code:

var rand1 = Math.round(randnum * (inum-1)) + 1;

With that code, images 1 and 7 will turn up HALF as often as the other images.

If you want all images to appear equally, it needs to be this:
Code:

var rand1 = Math.floor(randnum * inum) + 1;

If you care, I can prove it to you.