js取得滑鼠點擊的位置實現想法及程式碼_javascript技巧
May 16, 2016 pm 04:49 PM
滑鼠點擊
copy來的,但是原頁面的程式碼還是需要修改,下面是修改可用的
常用的是event.clientX和event.clientY分別取得橫向的和縱向的位置,但僅使用這個方法是不夠的,因為event.clientX和event.clientY取得的滑鼠位置是相對於目前畫面的,而不考慮頁面的捲軸所滾動的距離。
複製程式碼 程式碼如下:
function pointerX(event)
{
return event.pageX || (event.clientX (document.documentElement.scrollLeft || document.body.scrollLeft));
}
function pointerY(event)
{
return eventf .pageY || (event.clientY (document.documentElement.scrollTop || document.body.scrollTop));
}
兩個方法分別獲得相對整個頁面(而不是螢幕)的滑鼠位置
event.pageX是在FF中所支援的,這樣就實作了跨瀏覽器操作
只需在其他方法中呼叫這兩個函數就可
複製程式碼 程式碼如下:
function getPointPosition(event)
{ event.clientX;
var y_px_scr = event.clientY;
alert("相對於目前畫面的X軸偏移" x_px_scr);//相對於裝置(PC或行動裝置)
alert("相對於目前螢幕的Y軸偏移量" y_px_scr);//相對於裝置(PC或行動裝置)
var x_Px_page = pointerX(event);
var y_Px_page = pointerY(event);
alert("相對於整個頁面的X軸偏移" x_Px_page); //相對於瀏覽器
alert( "相對於整個頁面的Y軸偏移" y_Px_page); //相對於瀏覽器
}
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱門文章
擊敗分裂小說需要多長時間?
3 週前
By DDD
倉庫:如何復興隊友
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗?
3 週前
By 王林
兩個點博物館:所有展覽以及在哪裡可以找到它們
3 週前
By 尊渡假赌尊渡假赌尊渡假赌

熱門文章
擊敗分裂小說需要多長時間?
3 週前
By DDD
倉庫:如何復興隊友
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗?
3 週前
By 王林
兩個點博物館:所有展覽以及在哪裡可以找到它們
3 週前
By 尊渡假赌尊渡假赌尊渡假赌

熱門文章標籤

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)