CODEWITHSUNDEEP
javascriptjquery
Robert DeBoer
Robert DeBoer

Reputation: 1695

Get top of current window position relative to the document body

I am developing a model box jQuery plugin, and I need to know how to get some window properties.

The box and its shader div fade over top of the page, and the shader div covers the complete body, not just the window (Important for pages that have horizontal scroll bars). When the model div fades in, it centers itself horizontally and vertically based on the window. However, this won't work if the user scrolled down the page some ( the box will be at the top of the page since it centers based on the window size alone).

Is there a way to get the window top and left position relative to the body.
For example, the user has scrolled down the page and clicked whatever to open the model box, what can I do to get the number of pixels the top of the window is down from the top of the body.

Upvotes: 20

Views: 65591

Answers (3)

Funky Dude
Funky Dude

Reputation: 3947

for the overlay you can do

.ModalOverlay
{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

and you just show or hide it.

Upvotes: 0

kangax
kangax

Reputation: 39168

This should do it:

document.documentElement.scrollTop || document.body.scrollTop;
document.documentElement.scrollLeft || document.body.scrollLeft;

Upvotes: 36

Bela
Bela

Reputation: 3464

Unless I'm misunderstanding the question I think you are just looking for

$(window).scrollTop()

Upvotes: 16

Related Questions