css help
Out of context: Reply #6
- Started
- Last post
- 11 Responses
- neverblink0
yeah, the 100% background image size is actually set to the height of the viewport (browser inner window) not the height of the document! This causes the whitespace to appear when people scroll..
You will need to put the background image inside a div that is set to 100% width and 100% height, then with javascript do something like..
body.onresize
get the document's dimensions
then check if the viewport is smaller than the document
if it is smaller you'll have scrollbars
if there are scrollbars reset the size of the container holding the backgroundimage to the size of the documentnote that onresize only fires after the mouse has been released.. so while resizing the backgroundimage will not resize and you will still get whitespace.. The only way around that is having a continously running script, which will make your site uber-slow ;)
- btw. this will probably be solved in CSS 3 (background-size property)neverblink
- sorry "document.onresize"neverblink