Click to See Complete Forum and Search --> : background/image resize


leechun
05-14-2003, 07:21 PM
hello people:

I am fairly new to JavaScript and have been experimenting with it on my own. I have got this question I wonder if anyone can tell me why.

I have been trying to resize the background image to the size of the document using "document.body.clientWidth" and "document.body.clientHeight". it kind of works. However, the scroll bars always seems to appear, which I think they should not as the size of the image is the exact size of the document. Making sense? Anyway, the code goes like this.

Thanks for your time the help :)

<html>
<head>

<script type = "javascript">

function get_win_size()
{
var win_width = document.body.clientWidth;
var win_height = document.body.clientHeight;

bg.width = win_width;
bg.height = win_height ;

timer=setTimeout("get_win_size()",100);
}

function stoptimer()
{
clearTimeout(timer)
}

</script>
</head>

<body onload = "get_win_size()" onunload = "stoptimer()">

<div style="position:absolute;top:0px;left:0px">

<img id = "bg" src = "images/some_picture.gif" >

</div>


</body>
</html>

havik
05-15-2003, 12:43 AM
I think IE's vertical scrollbar will always appear unless it is adjusted in the options menu or something.

BTW, use window.innerWidth and window.innerHeight for NS

var ns4 = (document.layers) ? 1 : 0;
var ie4 = (document.all) ? 1 : 0;
var ns6 = (document.getElementById && !document.all) ? 1 : 0;

// functions like these will return the browser window size, you // can edit them to meet your needs

function winWid(){ return (ns4||ns6) ? window.innerWidth : document.body.clientWidth; }

function winHei(){ return (ns4||ns6) ? window.innerHeight : document.body.clientHeight; }


Havik