html - Have top left corner of div always start the coordinates at 0,0 in javascript? - Stack Overflow

admin管理员组

文章数量:1425195

If I create a div tag with red color filled in at 300 x 300 pixels, I want to make it so that the coordinate system is 0,0 at the corner of the div tag instead of page. So regardless of where the div tag is positioned, the top left corner of that div tag is always 0,0.

If possible, it would be great if scrolling could be taken into account such that if I scroll down a bit, i can still click on the top left corner of the div and it would still know that it is the 0,0.

It would involve something like: event.clientX and event.clientY or maybe there is a better method to acplish this.

If I create a div tag with red color filled in at 300 x 300 pixels, I want to make it so that the coordinate system is 0,0 at the corner of the div tag instead of page. So regardless of where the div tag is positioned, the top left corner of that div tag is always 0,0.

If possible, it would be great if scrolling could be taken into account such that if I scroll down a bit, i can still click on the top left corner of the div and it would still know that it is the 0,0.

It would involve something like: event.clientX and event.clientY or maybe there is a better method to acplish this.

• javascript
• html

Share Improve this question Follow asked May 18, 2011 at 14:36 RevieraReviera 111 silver badge22 bronze badges 3

• Can you not make the 300x300 div wrap all of your content and position all of the children using relative? – Doug Stephen Commented May 18, 2011 at 14:38
• The concept I would like to apply to table as well, like: if I had two rows in a table, and i made the first row a height of 30pixels. The second row contains the div. I want to be able to mouseover/click the top left corner of the row and have it be 0,0. The method to do this I think involves attaching the mouse event listener to the div, but im not sure what the syntax would be. – Reviera Commented May 18, 2011 at 14:39
• The answer to this question might help you. – Jeremy Commented May 18, 2011 at 14:40

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 3

Are you meaning to do something like the following?

<div style="position: fixed; top: 0px; left: 0px; width: 300px; height: 300px;">
</div>

本文标签：