0

I want to get screenY when click, but in iOS browser(Edge,Safari...), e.screenY is same as e.pageY.

document.addEventListener('click', e => {
    // why are screenY and pageY same?
    console.log(e.screenY, e.pageY);
});
atomm
  • 11
  • 1

1 Answers1

0

You see, screenY (or better) screenTop is very much different from the pageY.

screenY refers to the number of pixels from the top edge of the browser viewport to the top edge of the screen. MDN Ref.'screenY'

Whereas, pageY refers to the Y coordinate in pixels of the event relative to the whole document also taking into account any vertical scrolling as well. MDN Ref. 'pageY'

So, essentially,

screenY can be used to just know the vertical location of the viewport with respect to the user's screen.

And pageY can be used to get the location of some user event (like 'click' as you suggested or scroll, etc) wrt to the top the the document.

Now as to your query, you must have clicked on the extreme upper border of your viewport, so they can be same in that case.

Sapt-Programmer
  • 41
  • 1
  • 7
  • thanks, but the screenY is MouseEvent's [screenY](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/screenY) not window.screenY. – atomm Aug 20 '21 at 08:04
  • Yeah sure @atomm, if you give `instanceOfMouseEvent.screnY`, it will show the _y-coordinate of the **specified mouse event**_. Whereas, the `window.screenY` returns the _y-coordinate of the **viewport** wrt **user's screen**_. I am sure that [this](https://stackoverflow.com/questions/6073505/what-is-the-difference-between-screenx-y-clientx-y-and-pagex-y) will surely clarify the issue. – Sapt-Programmer Aug 21 '21 at 04:01
  • I know the difference between them, so the question is that on an iPhone, MouseEvent.screenY's value is same as pageY, but they should not be same especially after scolling the page. maybe you can try the code on an iPhone, scoll the page, click, check the e.screenY and e.pageY, you'll know the issue. – atomm Aug 22 '21 at 05:39
  • Then it might as well be a bug, we can do nothing much in that case I guess. But it's sure worth pointing out. – Sapt-Programmer Aug 23 '21 at 09:42