js使用onmousemove和onmouseout獲取鼠標(biāo)坐標(biāo)的方法
本文實(shí)例講述了js使用onmousemove和onmouseout獲取鼠標(biāo)坐標(biāo)的方法。分享給大家供大家參考。具體如下:
下面的js代碼演示了onmousemove和onmouseout事件的用法,鼠標(biāo)在指定區(qū)域內(nèi)移動(dòng)時(shí)會(huì)動(dòng)態(tài)顯示鼠標(biāo)坐標(biāo)信息
<!DOCTYPE html> <html> <head> <script> function myFunction(e) { x=e.clientX; y=e.clientY; coor="Coordinates: (" + x + "," + y + ")"; document.getElementById("demo").innerHTML=coor } function clearCoor() { document.getElementById("demo").innerHTML=""; } </script> </head> <body style="margin:0px;"> <div id="coordiv" style="width:199px;height:99px;border:1px solid" onmousemove="myFunction(event)" onmouseout="clearCoor()"></div> <p>Mouse over the rectangle above, and get the coordinates of your mouse pointer.</p> <p id="demo"></p> </body> </html>
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
- JS獲取鼠標(biāo)坐標(biāo)位置實(shí)例分析
- js實(shí)現(xiàn)獲取div坐標(biāo)的方法
- javascript獲取文檔坐標(biāo)和視口坐標(biāo)
- javascript實(shí)時(shí)獲取鼠標(biāo)坐標(biāo)值并顯示的方法
- JS網(wǎng)頁在線獲取鼠標(biāo)坐標(biāo)值的方法
- javascript獲取當(dāng)前鼠標(biāo)坐標(biāo)的方法
- JavaScript獲取鼠標(biāo)移動(dòng)時(shí)的坐標(biāo)(兼容IE8、chome谷歌、Firefox)
- JS onmousemove鼠標(biāo)移動(dòng)坐標(biāo)接龍DIV效果實(shí)例
- js鼠標(biāo)及對(duì)象坐標(biāo)控制屬性詳細(xì)解析
- JavaScript獲取對(duì)象在頁面中位置坐標(biāo)的方法
相關(guān)文章
JS使用canvas中的measureText方法測(cè)量字體寬度示例
這篇文章主要介紹了JS使用canvas中的measureText方法測(cè)量字體寬度,結(jié)合實(shí)例形式分析了canvas的measureText方法相關(guān)使用技巧,需要的朋友可以參考下2019-02-02javascript字符串拆分成單個(gè)字符相加和不超過10,求最終值
javascript字符串拆分成單個(gè)字符相加和不超過10,求最終值2008-09-09通用于ie和firefox的函數(shù) GetCurrentStyle (obj, prop)
通用于ie和firefox的函數(shù) GetCurrentStyle (obj, prop)...2006-12-12微信小程序第三方框架對(duì)比 之 wepy / mpvue / taro
這篇文章主要介紹了小程序第三方框架對(duì)比 ( wepy / mpvue / taro ) 分析,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2019-04-04Echarts中X軸/Y軸坐標(biāo)標(biāo)簽顯示不下的問題解決
本文主要介紹了Echarts中X軸/Y軸坐標(biāo)標(biāo)簽顯示不下的問題解決,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-09-09