screenY,pageY,clientY,layerY屬性用法簡單介紹

螞蟻小編發表於2017-04-04
client

本章節簡單介紹一下標題中四個屬性的作用。

從標題中屬性的名稱可以看到一定有一個對應的最後一個字元是"X"的屬性，比如screenX。

不過它們的原理都是一樣的，只是表示方位的不同而已。

下面先上圖示，後面再跟著相關介紹:

a:3:{s:3:\"pic\";s:43:\"portal/201704/04/003444hxr7d7xzdehsheft.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

一.screenY:

滑鼠相對於顯示器螢幕左上角的偏移。

二.pageY:

滑鼠相對於頁面左上角的偏移 (其值不會受滾動條的影響)。

也就是當前滑鼠指標距離瀏覽器客戶區頂部的距離+上頁面向上滾動的距離。

IE9之下並不支援這個屬性。

三.clientY:

滑鼠相對於瀏覽器視口（客戶區）左上角的偏移

注意:clientY和pageY的區別，clientY在頁面無滾動條的情況下值等同於pageY

四.layerY:

此屬性這裡就不多介紹了，具體可以參閱以下文章。

javascript的layerX和layerY屬性用法介紹一章節。

相關文章