`

JS获得鼠标位置

阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<script>
function mouseMove(ev)
{
ev= ev || window.event;
  var mousePos = mouseCoords(ev);
  //alert(ev.pageX);
      document.getElementById('xxx').value = mousePos.x;
      document.getElementById('yyy').value = mousePos.y;
}
function mouseCoords(ev)
{
if(ev.pageX || ev.pageY){
   return {x:ev.pageX, y:ev.pageY};
}
return {
     x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
     y:ev.clientY + document.body.scrollTop     - document.body.clientTop
};
}
document.onmousemove = mouseMove;
</script>
Mouse X Position:
<input id=xxx type=text>
<br>Mouse Y Position:
<input id=yyy type=text>

</body>
分享到:
评论

相关推荐

    JS获得鼠标位置(兼容多浏览器ie,firefox)

    提供的压缩包文件`JS获得鼠标位置(兼容多浏览器ie,firefox).htm`可能包含了这个功能的示例代码,可以打开查看具体的实现。在实际应用中,确保对各种浏览器进行充分测试,以确保兼容性和准确性。

    JavaScript获取鼠标位置和鼠标与div的相对位置

    在JavaScript中,获取鼠标位置和计算鼠标与特定div元素的相对位置是常见的需求,这在交互式网页开发中尤其重要。下面将详细讲解如何实现这些功能。 首先,我们需要理解两个基本概念:`event.clientX` 和 `event....

    javascript获得鼠标的坐标值

    这里,我们首先通过`getBoundingClientRect()`获取目标元素的大小和位置,然后从鼠标坐标中减去元素的位置,得到相对于元素的坐标。 ### 补充知识点 - `event`对象:在JavaScript事件处理函数中,浏览器自动传递的...

    js获取鼠标点击位置

    1. **定义**:`event.clientX` 和 `event.clientY` 是 JavaScript 事件对象中的属性,用于获取鼠标点击位置相对于视口(即浏览器窗口)的横纵坐标。 2. **局限性**:虽然这两个属性能够提供基本的位置信息,但它们...

    js实现鼠标拉框截图

    3. **计算截图区域**:当鼠标按下并移动时,我们记录下鼠标的起始坐标(`x1`, `y1`)和结束坐标(`x2`, `y2`),这样就可以得到截图框的尺寸和位置。注意,要确保截图框的大小始终正确,即使用户先按住鼠标右键移动...

    js实现鼠标滚轮控制图片缩放效果的方法

    本文将详细介绍如何使用JavaScript来实现通过鼠标滚轮控制图片缩放效果的方法,其中将涉及onmousewheel事件的使用以及JavaScript操作DOM来调整图片大小的技巧。 首先,我们应当理解onmousewheel事件。这是一个鼠标...

    js实现鼠标点击文本框自动选中内容的方法

    标题中提及的"js实现鼠标点击文本框自动选中内容的方法"主要涉及到的是JavaScript编程语言中的两个概念:鼠标点击事件(onClick)和文本选择事件(select)。在Web开发中,页面上的文本框(input type="text")或者...

    获取鼠标相对位置

    至于`ImageSpliter.js`,它可能是一个用于分割图像的JavaScript工具,其中可能就用到了获取鼠标位置的功能。例如,用户可以通过拖动鼠标选择图像的一部分进行裁剪或分割。在这个场景下,获取鼠标相对位置就显得尤为...

    JS获得鼠标位置(兼容多浏览器ie,firefox)脚本之家修正版

    5. JavaScript中常见的事件:文档中没有具体说明,但是可以合理推测,要获取鼠标位置,需要用到与鼠标事件相关的JavaScript事件,如onclick、onmousemove等,这些事件在用户与网页交互时触发,并能调用相关的处理...

    js鼠标事件大全js鼠标事件大全

    JavaScript(简称JS)鼠标事件是网页交互中常用的一类事件,它们允许开发者在用户与页面上的元素进行鼠标操作时执行特定的功能。以下是一些主要的JS鼠标事件及其详细解释: 1. onClick:当用户单击鼠标按钮并在同一...

    Javascript鼠标事件汇总

    3. **自定义提示**:通过`onMouseOver`和`onMouseOut`事件,可以根据鼠标位置显示提示信息或工具提示。 #### 五、注意事项 - 不同浏览器可能对某些事件的支持程度不同,因此在开发时应考虑浏览器兼容性问题。 - ...

    《用JavaScript得到鼠标指针的位置》(高清晰pdf版)

    - 事件监听器的基础知识及其在捕获鼠标位置中的应用。 - 在不同浏览器环境下(如IE、Firefox、Chrome等)实现一致性的解决方案。 - 获取鼠标相对于页面或特定元素的坐标的方法。 - 使用DOM操作来动态更新用户界面上...

    JS获取鼠标相对位置的方法

    `m()`函数通过将鼠标位置信息更新到页面上的一个指定元素(id为"area"的div)的innerHTML中,来实现鼠标位置的实时显示。而`c()`函数则在元素被点击时,计算鼠标位置相对于该元素的位置,并通过alert()函数弹出显示...

    获取鼠标在页面上的位置(包括滚动条)

    3. **计算鼠标在页面上的实际位置**:结合页面滚动量与鼠标在视口的位置,得到鼠标在页面上的位置。 #### 代码详解 ```javascript /** * 获取鼠标在页面上的位置 * @param ev 触发的事件 * @return {x: 鼠标在...

    javascript js 鼠标事件 大全,js鼠标拖动事件,js鼠标移动事件.docx

    - **用途**:跟踪鼠标位置,实现动态效果或游戏中的角色移动。 ##### 7. `onMouseOut` - **描述**:当鼠标指针离开页面元素时触发。 - **用途**:与`onMouseOver`相反,实现鼠标离开后的效果变化。 #### 三、键盘...

    javascript鼠标事件大全

    ### JavaScript鼠标事件大全 在JavaScript编程中,鼠标事件是非常重要的交互元素之一,它们允许开发者捕捉用户的鼠标动作,并根据这些动作触发相应的脚本处理。本文将详细介绍JavaScript中的各种鼠标事件及其特性,...

    获取鼠标在文档的坐标位置(兼容多浏览器)

    在不同的浏览器中,获取鼠标位置的方法可能会有所不同,因此编写一段能够跨浏览器运行的代码至关重要。 #### 二、基本原理 1. **事件对象**: 在JavaScript中,每当一个事件被触发,都会生成一个事件对象。这个对象...

    JavaScript鼠标手势识别

    这个程序里边并没有训练方法,我只是把书中训练好的数据提取出来,直接输入到JavaScript写的神经网络里,这样一打开程序就能直接识别,否则还得训练,就现在javascript的执行效率,这不得到猴年马月去了!...

    javascript网页与鼠标特效

    JavaScript由 Netscape 公司开发,最初命名为LiveScript,后因获得Sun Microsystems的许可,改名为JavaScript。它是基于ECMAScript标准的一门编程语言,主要在浏览器环境中运行。JavaScript的主要作用包括网页动态...

    根据鼠标进入的位置加入遮罩

    本项目名为"SlipHover-master",旨在通过JavaScript和CSS技术实现这一功能,让用户在鼠标悬停时能动态地看到遮罩层,从而获得更多的上下文信息或者突出显示某个区域。 首先,我们要理解遮罩层的概念。遮罩层通常是...

Global site tag (gtag.js) - Google Analytics