TalkPHP - Measure height of page in pixels..?

TalkPHP (http://www.talkphp.com/forums.php)

- Advanced PHP Programming (http://www.talkphp.com/advanced-php-programming/)

- - Measure height of page in pixels..? (http://www.talkphp.com/advanced-php-programming/1849-measure-height-page-pixels.html)

Aaron

01-03-2008 08:51 AM

Measure height of page in pixels..?

I need to measure the height of a page in pixels, and then set the height of a div to that height minus X amount of pixels... How would I do that? O.o

(height:auto; doesn't work in IE or Opera...)

Seems like a javascript kinda' thing, but javascript can get browser iffy, and I don't know JS anyway O.o.

sjaq	01-03-2008 11:54 AM

Put this in your css::

Code:

#yourdiv {

        width: expression((document.body.clientHeight-20) + 'px');

}

Replace 20 with a number of choice and #yourdiv with your selector ;-)

edit: You should've posted this in the HTML and CSS section

ReSpawN

01-03-2008 05:43 PM

It isn't that advanced as well. There a LOT of resize and size measuring tools around. Most of them are Javascript based. So, simply search for "Resolution Detection Javascript" or what ever, and you should probably find what you're looking for.

Once again Aaron, I've told you before, don't bite off more than you can chew! :-) Friendly advice non the less.

Andrew

01-03-2008 06:42 PM

I've never had to use expression() in my CSS before, but will it automatically update upon resizing? I understand it might not work DURING the resize, but once you finish, will it update?

Aaron

01-03-2008 07:00 PM

The expression isn't working for me... T.T

Respawn, why do you think that this is more than I can chew?

TlcAndres

01-03-2008 07:51 PM

The O.o makes it seemed like your completely and utterly baffled which is somethin akin to "biting off more than you chew".

ReSpawN

01-03-2008 08:23 PM

Quote:

Originally Posted by TlcAndres (Post 7574)

The O.o makes it seemed like your completely and utterly baffled which is somethin akin to "biting off more than you chew".

There's my backup on this one. It's not meant as offense, but if you had any clue what to look for, you could have found out yourself. That's the general way I learned Javascript & PHP combined.

Rendair

01-04-2008 01:09 PM

I made this code couple weeks ago its very simple one.

PHP Code:


		
			
<script type="text/javascript">
    
function overLay(){

    var height = document.body.clientHeight;
    var width = document.body.clientWidth;
    
    document.getElementById("overlay").style.width = width;
    document.getElementById("overlay").style.height = height;
    document.getElementById("overlay").style.opacity = 0.2;
}
    
</script>

It will leave a gap around the page, but you can also make it so it sets the body margin to 0 so it fits plush to the sides. :-D

Here is an example i made: HERE

Wildhoney

01-04-2008 01:13 PM

I see one issue with that, Rendair, and that is the bottom of the scroll bar is missing on the window that pops-up after you click grow. In Firefox, anyhow.

Rendair

01-04-2008 01:24 PM

Quote:

Originally Posted by Wildhoney (Post 7610)

I see one issue with that, Rendair, and that is the bottom of the scroll bar is missing on the window that pops-up after you click grow. In Firefox, anyhow.

Indeed it does need tweaking, but that pop up is just a feature you can add the code above does not give you that, but just lets you cover the page with a div :-D

Wildhoney

01-05-2008 01:14 AM

Aye! In that case it is very nice :-) Excuse my finickiness!

All times are GMT. The time now is 03:23 AM.