By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,408 Members | 1,840 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,408 IT Pros & Developers. It's quick & easy.

How to get actual width and height of body ?

P: n/a
I am making a site with lot of AJAX components. When I present a form
(in a layer on top of contents of page) I want to make sure that the
user cannot click on a link or button other then on the form. The way
to do this is to create a layer just underneath the form that blocks
the elements on the page underneath. This is the easy part. The hard
part is to get the size of the blocking layer right.
Using width:100% and height:100% the layer only covers the visible
part of the page: when you scroll down or left you can access elements
(libnks, buttons of the page). Using document.body.clientWidth
and .clientHeight or document.body.offsetWidth and .offsetHeight or
document.body.scrollWidth and .scrollHeight the blocking layer only
covers the initial width and height of the body (at load). When the
page has increased in width and height after loading this is not
covered. How can I get the actual width and height of the page ?

thanx,

JM

Jun 15 '07 #1
Share this Question
Share on Google+
5 Replies


P: n/a

Pugi! wrote:
I am making a site with lot of AJAX components. When I present a form
(in a layer on top of contents of page) I want to make sure that the
user cannot click on a link or button other then on the form. The way
to do this is to create a layer just underneath the form that blocks
the elements on the page underneath. This is the easy part. The hard
part is to get the size of the blocking layer right.
Using width:100% and height:100% the layer only covers the visible
part of the page: when you scroll down or left you can access elements
(libnks, buttons of the page). Using document.body.clientWidth
and .clientHeight or document.body.offsetWidth and .offsetHeight or
document.body.scrollWidth and .scrollHeight the blocking layer only
covers the initial width and height of the body (at load). When the
page has increased in width and height after loading this is not
covered. How can I get the actual width and height of the page ?
Remember to search the archives before posting, very often your
question has already been answered. The subject below may not seem to
be what you are after, but I think the content of the thread is.

"FAQ Topic - How do I find the size of a browser window?"
<URL:
http://groups.google.com.au/group/co...13241414a0fad9
>

--
Rob

Jun 15 '07 #2

P: n/a
On Jun 15, 5:47 am, Pugi! <pugin...@gmail.comwrote:
I am making a site with lot of AJAX components. When I present a form
(in a layer on top of contents of page) I want to make sure that the
user cannot click on a link or button other then on the form. The way
to do this is to create a layer just underneath the form that blocks
the elements on the page underneath.
Use jQuery and the BlockUI plugin and you'll be done in about 10
seconds.

Matt Kruse
Jun 15 '07 #3

P: n/a
On Jun 15, 12:47 pm, Pugi! <pugin...@gmail.comwrote:
I am making a site with lot of AJAX components. When I present a form
(in a layer on top of contents of page) I want to make sure that the
user cannot click on a link or button other then on the form. The way
to do this is to create a layer just underneath the form that blocks
the elements on the page underneath. This is the easy part. The hard
part is to get the size of the blocking layer right.
Using width:100% and height:100% the layer only covers the visible
part of the page: when you scroll down or left you can access elements
(libnks, buttons of the page). Using document.body.clientWidth
and .clientHeight or document.body.offsetWidth and .offsetHeight or
document.body.scrollWidth and .scrollHeight the blocking layer only
covers the initial width and height of the body (at load). When the
page has increased in width and height after loading this is not
covered. How can I get the actual width and height of the page ?

thanx,

JM
I have the very same problem. Actually, I *had* :) because later I
gave up the idea because I didn't like the visual effect of it.
Anyway, my solution of the problem was that I executed the function
that put the panel over the whole screen in the beginning, and then
manually the function that resizes the panel each time I do page-
updates based on the data I received with Ajax. I didn't like the
solution much, but it worked well. I would have liked it solved using
plain CSS, but it's true that 100% doesn't work well - didn't work for
me neither.

Jun 15 '07 #4

P: n/a
RobG wrote:
Remember to search the archives before posting, very often your
question has already been answered. The subject below may not seem to
be what you are after, but I think the content of the thread is.

"FAQ Topic - How do I find the size of a browser window?"
<URL:
http://groups.google.com.au/group/co...13241414a0fad9
PMFJI, but that is a link to a thread discussing the topic, but that
particular thread doesn't appear to fully resolve what actually IS the
proper way to do it. Is it the consensus that the original method posted
from the FAQ is correct? I ask because others in the thread dispute that.
Jun 15 '07 #5

P: n/a
JM
RobG wrote:
Pugi! wrote:
>I am making a site with lot of AJAX components. When I present a form
(in a layer on top of contents of page) I want to make sure that the
user cannot click on a link or button other then on the form. The way
to do this is to create a layer just underneath the form that blocks
the elements on the page underneath. This is the easy part. The hard
part is to get the size of the blocking layer right.
Using width:100% and height:100% the layer only covers the visible
part of the page: when you scroll down or left you can access elements
(libnks, buttons of the page). Using document.body.clientWidth
and .clientHeight or document.body.offsetWidth and .offsetHeight or
document.body.scrollWidth and .scrollHeight the blocking layer only
covers the initial width and height of the body (at load). When the
page has increased in width and height after loading this is not
covered. How can I get the actual width and height of the page ?

Remember to search the archives before posting, very often your
question has already been answered. The subject below may not seem to
be what you are after, but I think the content of the thread is.

"FAQ Topic - How do I find the size of a browser window?"
<URL:
http://groups.google.com.au/group/co...13241414a0fad9
--
Rob
The solution presented in the link doesn't work at all. It positions a
div at the moment a page is loaded, but doesn't adjust when you scroll
down or add content to a page. I either need something that covers the
entire page (not only the visible part in the browser) or that
continuously covers the portion of the page in the browser window (even
when scrolling). I need it to cover the page at the moment I activate
this feature, not the pagesize at the moment it was loaded.

JM
Jun 15 '07 #6

This discussion thread is closed

Replies have been disabled for this discussion.