關於offsetX、layerX、clientX、screenX以及pageX

【轉載請註明出處】:https://blog.csdn.net/huahao1989/article/details/107775411算法

咱們都熟知,標題中的幾個方法都是用來獲取事件(event)的位置,可是他們有什麼區別呢?就用一張圖來講明
image.png後端

  • offsetX: 指事件發生位置相對觸發元素左上角的水平座標
  • layerX: FF特有,鼠標相比較於當前座標系的位置,即從當前容器依次往上尋找設置絕對定位或相對定位的元素爲參考座標系,以該容器的左上角來計算水平座標
  • clientX: 是指事件發生位置相對可視區域的水平座標(只是document展示的部分,不包括搜索欄、書籤欄等)
  • screenX: 是指事件發生位置相對電腦屏幕的水平座標
  • pageX: 是指事件發生位置相對文檔(document)的水平座標(是指整個文檔,當出現滾動條時,隱藏的部分也會被算入pageX)
歡迎關注 「後端老鳥」 公衆號,接下來會發一系列的專題文章,包括Java、Python、Linux、SpringBoot、SpringCloud、Dubbo、算法、技術團隊的管理等,還有各類腦圖和學習資料,NFC技術、搜索技術、爬蟲技術、推薦技術、音視頻互動直播等,只要有時間我就會整理分享,敬請期待,現成的筆記、腦圖和學習資料若是你們有需求也能夠公衆號留言提早獲取。因爲本人在全部團隊中基本都處於攻堅和探路的角色,搞過的東西多,遇到的坑多,解決的問題也不少,歡迎你們加公衆號進羣一塊兒交流學習。

【轉載請註明出處】:https://blog.csdn.net/huahao1989/article/details/107775411學習

image

相關文章
相關標籤/搜索