這篇文章主要介紹了Js和JQuery獲取鼠標指針坐標的實現代碼分享,本文直接給出實現的代碼,需要的朋友可以參考下
- <!DOCTYPE html>
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
- <title>jquery 獲取鼠標指針的坐標</title>
- <script>
- //普通js函數
- function test(event) {
- event = event || window.event;
- var x = event.offsetX || event.layerX;
- var y = event.offsetY || event.layerY;
- alert("x="+x+"; y="+y);
- }
- //jquery函數
- $(function(){
- $("#t").mouseover(
- function(event){
- event = event || window.event;
- var x = event.offsetX || event.originalEvent.layerX;
- var y = event.offsetY || event.originalEvent.layerY;
- alert("x:"+x+"; y:"+y);
- }
- );
- });
- </script>
- </head>
- <body>
- <div id="t" style="float:left;background-color: green;width: 300px;height: 60px;">測試鼠標位置(jquery函數處理)</div>
- <div id="s" onmouseover="test(event)" style="float:left;background-color: red;width: 300px;height: 60px;margin-left:10px;">測試鼠標位置(普通js函數處理)</div>
- </body>
- </html>
新聞熱點
疑難解答
圖片精選