Screen visible area

[Vadim]

I want to know which area of my html is visible now?

I have little menu (use<div>) that pop-up close to table cell, which have been clicked to get a menu. I use cell.offsetParent to get the cell top and left position.
That work fine while user did not clicked on cell near screen border. So, they whant that menu appears always completely visible. How to do that?

 

[Marklar]

You need to use an if statement to check the coordinates. If it's less than a certain value, set it to the minimum value to get the whole menu on the screen.

I'm not sure how you've used offsetParent so I'll assume you've got it to the stage where you have coordinates from the left and top. In the example I've called these values myXpos and myYpos. I'd need to see your code to be more specific.

if (myXpos < 20) {
myXpos = 20 ;
}
if (myYpos < 40) {
myYpos = 40;
}

Note: If you don't know already, browsers handle offsetParent differently:

Browser TD offsetParent
IE4/Windows TR
IE5+/Windows TABLE
IE/Mac TABLE
NN6 BODY

 

[Vadim]

This is my code:

if (obj.offsetParent) {
while (obj.offsetParent){
curLeft += obj.offsetLeft
curTop += obj.offsetTop
obj = obj.offsetParent;
}
}
else if (obj.x) {
curLeft += obj.x;
curTop += obj.y;
}
It gave me correct position of cell top left corner, but if the cell close to border the part of menu will be unseen.
If table is longer than could be shown on 1 screen and you scroll it to the buttom the buttom cell top offset may be 2000. The method screen.height give you fisical size of screen, but I need something that tell me coordinates of the top left corner of my HTML. So, I will be able to

if ((cornerTop + screen.heght) > curLeft)
curLeft = cornerTop + screen.heght - 200

 

[vilaishima]

Do not quite understand the first part of you post. To determine how much the page has been scrolled, try:

document.body.scrollTop;

Using this willl help determine how much the page has been scrolled and you can move the menu accordingly.

 

[Marklar]

It seems you're actually looking for an absolute position rather than a relative one.

There are a lot of X,Y methods to choose from. If I were you I'd use clientX (IE) and if you have no layers, layerX (NN).

// IE
if (event.clientX) {
curLeft = event.clientX;
if (curLeft < 20) {
curLeft = 20;
}
}
// NN
else if (evtObj.layerX) {
curLeft = evtObj.layerX;
if (curLeft < 20) {
curLeft = 20;
}
}

Then do the same using clientY and layerY