`
hellozhouqiao
  • 浏览: 2130 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

javascript 获取鼠标的坐标

阅读更多

一个Javascript鼠标事件,适时获取屏幕指定区域任一点鼠标的X、Y坐标值,并利用JS输出出来.

<title>Js获取适时获取鼠标坐标值并显示</title>
<script type="text/javascript">
  var getCoordInDocumentExample = function(){
    var coords = document.getElementById("coords");
    coords.onmousemove = function(e){
      var pointer = getCoordInDocument(e);
      var coord = document.getElementById("coord");
      coord.innerHTML = "X,Y=("+pointer.x+", "+pointer.y+")";
    }
  }
  var getCoordInDocument = function(e) {
    e = e || window.event;
    var x = e.pageX || (e.clientX +
      (document.documentElement.scrollLeft
      || document.body.scrollLeft));
    var y= e.pageY || (e.clientY +
      (document.documentElement.scrollTop
      || document.body.scrollTop));
    return {'x':x,'y':y};
  }
  window.onload = function(){
     getCoordInDocumentExample();
 };
</script>
<div id="coords" style="width:500px;height:200px;background:#F2F1D7;border:2px solid #0066cc;">
请在此移动鼠标。
</div>
<br />
<div id="coord" style="width:500px;border:2px solid #336699;">&nbsp;</div>

 原文链接 :http://www.cnblogs.com/GISerYang/archive/2012/09/10/2679344.html

转载请说明出处。

分享到:
评论

相关推荐

    Javascript获取鼠标坐标的各种类型

    JavaScript获取鼠标坐标是Web开发中的常见需求,尤其在交互式应用和动态效果中扮演着重要角色。本篇文章将详细介绍各种JavaScript方法来获取鼠标位置,并解释它们的用途和差异。 首先,我们可以使用`event`对象来...

    JQuery获取鼠标坐标

    本文将深入解析如何利用JQuery和原生JavaScript获取鼠标坐标,包括其工作原理、代码实现以及注意事项。 ### JQuery获取鼠标坐标 #### 工作原理 JQuery简化了原生JavaScript的操作,提供了强大的选择器和事件处理...

    JavaScript获取鼠标坐标的函数(兼容IE、FireFox、Chrome)

    本文将详细解析标题所提及的“JavaScript获取鼠标坐标的函数”,并探讨其兼容性以及如何在不同浏览器中正确使用。 首先,我们要明白在不同的浏览器环境下,鼠标坐标获取方式略有差异。在Internet Explorer (IE) 中...

    javascript获取当前鼠标坐标的方法

    本文实例讲述了javascript获取当前鼠标坐标的方法。分享给大家供大家参考。具体实现方法如下: 对于javascript获取当前鼠标坐标来说,得对不同浏览器的坐标位置有所了解。具体代码如下: 代码如下:&lt;html&gt; &lt...

    网页实现全屏获取鼠标坐标

    标题"网页实现全屏获取鼠标坐标"提示我们关注的核心是实现一个功能,使得无论浏览器窗口大小如何,都能获取到鼠标的全局坐标,包括在窗体外的坐标。 描述中提到"自己制作控件实现网页获取窗体外鼠标坐标",这可能是...

    javascript获取鼠标当前位置坐标并显示

    ### JavaScript 获取鼠标当前位置坐标并显示 #### 知识点概览 本文将详细介绍如何使用JavaScript来获取鼠标在页面上的当前位置坐标,并实时显示这些坐标值。该功能主要涉及到以下几个知识点: 1. **事件监听器...

    wincc获取鼠标位置.7z

    首先,实现这一功能需要了解WinCC的脚本编程,它支持VBScript或JavaScript,这两种脚本语言都可以用来获取鼠标的坐标。在WinCC中,可以通过创建一个事件,比如“鼠标点击”事件,然后在该事件的脚本中编写获取鼠标...

    火狐兼容获取鼠标的坐标

    在Web开发中,特别是在JavaScript编程中,获取鼠标坐标是一项常见的需求,用于实现各种交互效果,如拖放功能、点击位置分析等。在不同的浏览器中,实现这一功能的方法可能有所不同,因此需要进行兼容性处理。以下是...

    js与jquery中获取当前鼠标的x、y坐标位置的代码.docx

    ### JavaScript 获取鼠标坐标 在纯JavaScript中,我们可以利用`onmousemove`事件来监听鼠标移动,并通过事件对象(event object)来获取坐标值。以下是示例代码: ```html &lt;!DOCTYPE html&gt; &lt;title&gt;JavaScript 获取...

    使用JavaScript获取客户端的鼠标坐标信息

    总结起来,通过JavaScript获取客户端鼠标的坐标信息主要涉及`event.clientX`、`event.clientY`、`getBoundingClientRect()`以及滚动偏移量等概念。理解和掌握这些知识点,可以让你在构建交互式Web应用时更加得心应手...

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

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

    javascriptjs获取鼠标点击时的坐标位置

    javascriptjs获取鼠标点击时的坐标位置 只想帮你度过这个问题 加油你也行的

    javascript获得鼠标的坐标值

    在JavaScript中,获取鼠标的坐标值是一项常见的任务,它在用户交互和动态界面设计中扮演着重要角色。根据描述,我们将讨论两种不同的场景来获取这些坐标:一是相对于`body`元素,二是相对于某个特定的对象。 ### 1....

    C#限制鼠标活动区域并适时获取鼠标坐标

    不过,如果你需要在Web页面上获取鼠标坐标,可以使用JavaScript的`event.clientX`和`event.clientY`属性,或者在服务器端使用Ajax异步更新来实现类似的功能。 总的来说,C#提供了丰富的API和WinAPI接口来处理鼠标...

    跟随鼠标移动十字坐标显示,炫酷

    3. **坐标计算**:当`mousemove`事件触发时,我们可以从事件对象中获取鼠标的页面坐标(`event.clientX`和`event.clientY`)。接着,我们需要根据这些坐标更新十字架元素的CSS位置属性(如`left`和`top`),使其始终...

    显示鼠标坐标信息.rar

    JavaScript代码可能使用`event.clientX`和`event.clientY`来获取鼠标的X和Y坐标,这两个属性分别返回鼠标相对于当前视口左上角的水平和垂直距离。 在实际应用中,这样的功能可以用于创建交互式的地图、画布应用,...

    获取鼠标坐标

    在Web开发中,我们可以通过JavaScript来获取鼠标坐标。例如,`event.clientX` 和 `event.clientY` 属性可以分别返回鼠标在当前元素或视口中的水平和垂直位置。当用户在网页上点击或移动鼠标时,可以通过监听`...

    JavaScript实现鼠标移到地图上显示实际地理坐标

    本教程将深入探讨如何利用SuperMap iClient 6R for JavaScript库来实现一个功能,即当鼠标移动到地图上时,实时显示当前鼠标的地理坐标。SuperMap是一款强大的GIS软件,其iClient系列为开发者提供了丰富的JavaScript...

    鼠标坐标跟踪限时运行

    总之,“鼠标坐标跟踪限时运行”是IT领域中一项实用的技术,它结合了实时数据获取、时间限制以及用户行为分析,广泛应用于各种场景。理解和掌握这项技术,有助于提升软件开发和用户体验设计的能力。

Global site tag (gtag.js) - Google Analytics