JavaScript 中一些概念理解 :clientX、clientY、offsetX、offsetY、screenX、screenY

来源:http://www.cnblogs.com/jicheng/archive/2016/10/10/5944355.html
-Advertisement-
Play Games

JavaScript 中一些概念理解 :clientX、clientY、offsetX、offsetY、screenX、screenY ...


clientX 設置或獲取滑鼠指針位置相對於視窗客戶區域的 x 坐標,其中客戶區域不包括視窗自身的控制項和滾動條。 clientY 設置或獲取滑鼠指針位置相對於視窗客戶區域的 y 坐標,其中客戶區域不包括視窗自身的控制項和滾動條。 offsetX 設置或獲取滑鼠指針位置相對於觸發事件的(this)對象的 x 坐標。 offsetY 設置或獲取滑鼠指針位置相對於觸發事件的(this)對象的 y 坐標。 screenX 設置或獲取獲取滑鼠指針位置相對於用戶屏幕的 x 坐標。 screenY 設置或獲取滑鼠指針位置相對於用戶屏幕的 y 坐標。 x 設置或獲取滑鼠指針位置相對於父文檔的 x 像素坐標。 y 設置或獲取滑鼠指針位置相對於父文檔的 y 像素坐標。 如圖:圖片來源於網路

QQ截圖

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 使用bootstrap的js插件真的很好用啊有木有!! 但是第一次使用這個彈出框跟提示框的時候就被打擊了,沒有反應啊!! 然而這並不是一個大問題,一句話搞定,看代碼: 這是因為彈出框、工具提示插件不像之前所討論的下拉菜單及其他插件那樣,它不是純 CSS 插件。如需使用該插件,您必須使用 jquery ...
  • 今天給同學寫一個相冊照片滑鼠浮動顯示細節的效果,遇到了閃動的bug,也順利解決,就寫下來跟大家分享。 我使用的是‘標簽:hover + 標簽’的形式,如果使用jquery的mouseover、mouseout等事件,也可以參考此方法,原理一樣。 分析:圖片使用,然後使用div+span寫入滑鼠浮動要 ...
  • 今天第一次遇到const定義的變數,查閱了相關資料整理了這篇文章。主要內容是:js中三種定義變數的方式const, var, let的區別。 1.const定義的變數不可以修改,而且必須初始化。 2.var定義的變數可以修改,如果不初始化會輸出undefined,不會報錯。 3.let是塊級作用域, ...
  • 本文講述 padding / border 的設置後是否對 width 有影響,width 等於 auto 與 100% 的區別 CSS 框模型 (Box Model) 規定了元素框處理元素內容、內邊距、邊框 和 外邊距 的方式。 概述 那麼 css 屬性中width = ?呢 在標準的w3c的規定 ...
  • 用 或者 來監控文件的改變,當文件改變時,就自動刷新瀏覽器。 用 來實時編譯scss文件。 用 來非同步執行npm script命令。 先安裝上述的node工具 npm install browser sync 一、首先新建npm的 一般有如下的結構和選項 { "name": "about", "ve ...
  • 1.介紹 http-server 是一個簡單的零配置命令行HTTP伺服器, 基於 nodeJs. 如果你不想重覆的寫 nodeJs 的 web-server.js, 則可以使用這個. 2.安裝 安裝成功如下: 3.使用 在站點目錄下開啟命令行輸入 http-server 運行結果如圖: 在瀏覽器輸入 ...
  • 最近需要做一個zTree+EasyUi的許可權管理系統,以前有過接觸,在做這一塊時,用到了ztree,樹來載入咱們的菜單欄,後臺獲取登錄用戶信息的許可權列表,轉換成json對象來載入到咱們的樹當中,代碼如下: 你會發現人家早就想到了這一點,來實現這個效果,那麼, 我們就可以運用到自己的ztree當中了, ...
  • 一、簡介 這個例子是根據一個真實app的一個頁面的需求來實現的demo,通過動態add ui的方式,動態bind數據構建一個完整的課程表示例。示例並不完善,但是可以給大家一個啟發。 二、效果圖 三、相關下載 https://github.com/do-project/code4do/tree/mas ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...