想获取鼠标位置首先需要知道event对象
event对象
事件对象,是一个内置的全局对象,当一个事件发生的时候,和当前这个对象发生的这个事件有关的一些详细信息都会被临时保存到一个指定的地方 - event对象,供我们在需要的时候调用
更加全面的解释可以参考这个链接https://www.jianshu.com/p/c99905810bce
screenX screenY:相对于屏幕
// 当鼠标在图片上点击事件
$(".content").click((event) => {
var e = event || window.event ;
console.log("相对于屏幕"+e.screenX,e.screenY); //531 123
})
点击左上角,此时屏幕是全屏状态,当屏幕处于不全屏状态时,点击左上角此时,坐标还是531 123
clientX clientY:相对于浏览器内容可视区域
$(".content").click((event) => {
var e = event || window.event ;
console.log("相对于浏览器内容可视区域"+e.clientX,e.clientY);
})
全屏状态下输出:531 21
将浏览器屏幕缩小:此时输出了173 21