Js和JQuery獲取鼠標(biāo)指針坐標(biāo)的實(shí)現(xiàn)代碼分享
更新時(shí)間：2015年05月25日 12:10:18 投稿：junjie
這篇文章主要介紹了Js和JQuery獲取鼠標(biāo)指針坐標(biāo)的實(shí)現(xiàn)代碼分享,本文直接給出實(shí)現(xiàn)的代碼,需要的朋友可以參考下
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<title>jquery 獲取鼠標(biāo)指針的坐標(biāo)</title>
<script>
//普通js函數(shù)
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函數(shù)
$(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;">測試鼠標(biāo)位置（jquery函數(shù)處理）</div>
<div id="s" onmouseover="test(event)" style="float:left;background-color: red;width: 300px;height: 60px;margin-left:10px;">測試鼠標(biāo)位置（普通js函數(shù)處理）</div>
</body>
</html>
您可能感興趣的文章:
- jQuery實(shí)現(xiàn)獲取table中鼠標(biāo)click點(diǎn)擊位置行號與列號的方法
- jQuery實(shí)時(shí)顯示鼠標(biāo)指針位置和鍵盤ASCII碼
- js與jquery中獲取當(dāng)前鼠標(biāo)的x、y坐標(biāo)位置的代碼
- jquery實(shí)現(xiàn)的元素的left增加N像素 鼠標(biāo)移開會慢慢的移動(dòng)到原來的位置
- 為jquery.ui.dialog 增加“在當(dāng)前鼠標(biāo)位置打開”的功能
- jQuery獲得指定元素坐標(biāo)的方法
- jquery中獲得元素尺寸和坐標(biāo)的方法整理
- JQuery 獲得絕對,相對位置的坐標(biāo)方法
- jQuery實(shí)現(xiàn)獲取當(dāng)前鼠標(biāo)位置并輸出功能示例
相關(guān)文章
js技巧之十幾行的代碼實(shí)現(xiàn)vue.watch代碼
相信很多的用vue的人都知道vue雙向綁定的原理建立在，給屬性綁定了getter和setter，在屬性被改變的同時(shí)觸發(fā)視圖的再渲染。而本期也是借助這兩個(gè)內(nèi)置方法實(shí)現(xiàn)vue內(nèi)的watch2018-06-06
Sortable.js功能強(qiáng)大的JavaScript 拖拽庫示例詳解
SortableJS 是一個(gè)強(qiáng)大、靈活且易于使用的 JavaScript 庫,適用于各種類型的拖放排序需求,這篇文章主要介紹了Sortable.js功能強(qiáng)大的JavaScript 拖拽庫示例詳解,需要的朋友可以參考下2025-01-01
使用jscript實(shí)現(xiàn)二進(jìn)制讀寫腳本代碼
Reading And Writing Binary Files Using JScript正如我剛才推什么我能做的JScript中，我想出了對問題的二進(jìn)制文件。以下級的解決，這為小到中等大小的文件。我的部分包括這個(gè)職位在這里，因?yàn)槲壹磳⒏吨T表決，在一個(gè)職位約發(fā)送帶有附件的電郵通過JScript和它會使用這個(gè)二進(jìn)制文件碼來讀取，在二進(jìn)制附件檔案。2008-06-06
這篇文章主要介紹了Js實(shí)現(xiàn)粘貼上傳圖片的原理及示例，幫助大家更好的理解和使用JavaScript，感興趣的朋友可以了解下2020-12-12
這篇文章主要介紹了Javascript模塊導(dǎo)入導(dǎo)出詳解的相關(guān)資料,需要的朋友可以參考下2022-12-12
JavaScript中Function與Object的關(guān)系
本文主要介紹了JavaScript中Function與Object的關(guān)系，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-05-05
Javascript構(gòu)造函數(shù)是非常強(qiáng)大的,它可能也是Javascript能被充分利用的特點(diǎn)之一,文中通過實(shí)例代碼介紹的非常詳細(xì),這篇文章主要給大家介紹了關(guān)于JavaScript構(gòu)造函數(shù)的相關(guān)資料,需要的朋友可以參考下2023-04-04
javascript彈出一個(gè)層并增加一個(gè)覆蓋層
彈出一個(gè)層的js代碼，比較不錯(cuò)2008-10-10
JavaScript實(shí)現(xiàn)簡單版的留言發(fā)布與刪除
這篇文章主要介紹了如何通過JavaScript實(shí)現(xiàn)簡單的留言板功能：留言的發(fā)布與刪除。文中的示例代碼講解詳細(xì)，感興趣的小伙伴可以學(xué)習(xí)一下2022-03-03
js判斷主流瀏覽器類型和版本號的簡單實(shí)現(xiàn)代碼
下面小編就為大家?guī)硪黄猨s判斷主流瀏覽器類型和版本號的簡單實(shí)現(xiàn)代碼。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05