Js和JQuery获取鼠标指针坐标的实现代码分享
更新时间：2015年05月25日 12:10:18 投稿：junjie
这篇文章主要介绍了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>
相关文章
这篇文章主要介绍了JS分页的实现（同步与异步）,需要的朋友可以参考下2017-09-09
这篇文章主要介绍了小程序vant弹窗组件的实现方式，本文给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下2020-02-02
这篇文章主要介绍了JavaScript中调用函数的4种方式代码实例,本文分别给出方法调用模式、函数调用模式、构造器调用模式、apply调用模式4种方式的代码实例,需要的朋友可以参考下2015-07-07
JS面向对象、prototype、call()、apply()
那天用到prototype.js于是打开看看，才看几行就满头雾水，原因是对js的面向对象不是很熟悉，于是百度+google了一把，最后终于算小有收获，写此纪念一下^_^。2009-05-05
这篇文章主要介绍了js中substring和substr的定义和用法,需要的朋友可以参考下2014-05-05
JS DOM 操作实现代码，学习dom操作的朋友可以参考下。2010-08-08
数组扁平化也是面试常考题之一,今天就和大家简单分享一下常见的数组扁平方法,这题其实主要考察的是递归思想,因为当数组里面嵌套非常多层数组的时候只能通过循环递归来进行扁平,本次分享主要也是分享本题的递归思想,需要的朋友可以参考下2024-06-06
javascript用defineProperty实现简单的双向绑定方法
这篇文章主要介绍了javascript用defineProperty实现简单的双向绑定方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-04-04
这篇文章主要为大家详细介绍了JavaScript实现九宫格抽奖，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-06-06
mqtt.js 无法连接/错误提示 WebSocket connection to ‘ws://xxxxx‘
这篇文章主要介绍了mqtt.js 无法连接/错误提示 WebSocket connection to ‘ws://xxxxx‘ failed:,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2023-01-01
最新评论