這篇文章主要介紹了js使用onmousemove和onmouseout獲取鼠標坐標的方法,涉及javascript操作鼠標事件的技巧,具有一定參考借鑒價值,需要的朋友可以參考下
本文實例講述了js使用onmousemove和onmouseout獲取鼠標坐標的方法。分享給大家供大家參考。具體如下：
下面的js代碼演示了onmousemove和onmouseout事件的用法，鼠標在指定區域內移動時會動態顯示鼠標坐標信息
- <!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>
希望本文所述對大家的javascript程序設計有所幫助。
新聞熱點
疑難解答
圖片精選
