Javascript random background image size

Question

I have a code that shows a random background everytime I refresh, but I have no idea how I can make all images width100% and heigth 100%. Here's my code:

<html>
<head>
<script type="text/javascript"> 
var totalCount = 3;
function ChangeIt() 
{
var num = Math.ceil( Math.random() * totalCount );
document.body.background = 'bg'+num+'.png';
document.body.style.backgroundRepeat = "repeat";// bg repeat.
}
</script>
</head>
<body> 
----
</body> 
<script type="text/javascript"> 
ChangeIt();
</script> 
</html>

Any idea how to do this?

I don't actually get your point. – yakiang Oct 13 '13 at 16:36 — yakiang, Oct 13 '13 at 16:36

score 0 · Answer 1 · answered Oct 13 '13 at 16:38

You can try placing an image tag and setting the src property.That way , you can only specify the width and give an auto height.

function ChangeIt() 
{
    var widthOfDoc = document.body.clientWidth;
    var num = Math.ceil( Math.random() * totalCount );
    var image = new Image();
    image.src = 'bg'+num+'.png';
    image.width = widthOfDoc;
    document.body.appendChild(image);
}

Javascript random background image size

1 Answers1