代码如下：

<!doctype html>

<html>

<head>

　　<meta charset="utf-8">

　　<title>获取鼠标在Canvas中的坐标位置</title>

　　<style>

　　　　#canvas{

　　　　　　border:1px solid #ccc;

　　　　　　width:300px;

　　　　　　height:300px;

　　　　　　overflow:hidden;

　　　　}

　　</style>

　　<script>

　　　　function get_canvas(ev,obj){

　　　　 m_clientX = ev.clientX-obj.offsetLeft;

　　　　 m_clientY = ev.clientY-obj.offsetTop;

　　　　  document.getElementById("tips").innerHTML = "当前坐标：X："+ m_clientX + " ,Y：" +m_clientY;

　　　　}

　　</script>

</head>

<body>

　　<div id="tips"></div>

　　<div id="canvas" onmousemove="get_canvas(event,this)"></div>

</body>

</html>

兼容IE8+

Javascript获取当前鼠标在元素内的坐标定位的更多相关文章

  1. JavaScript获取HTML DOM节点元素详解(转)

    在Web运用程序特别是Web 2.0程序开发中,经常要获取页面中某个元素,然后更新该元素的样式.内容等.如何获取要更新的元素,是首先要处理的疑问. 51CTO推荐阅读:JavaScript DOM文档 ...

  2. javascript获取数组最后一个元素（三种方法）

    JavaScript 获取Array末尾元素 一.JavaScript pop() 方法 pop() 方法用于删除并返回数组的最后一个元素. 注意:pop() 方法将删除 arrayObject 的最 ...

  3. javascript 获取父页面中元素对象方法

    父页面中: <input type="hidden" id="areaID" value="test1"> <iframe ...

  4. [JavaScript] 获取数组中相同元素的个数

    /** * 获取数组中相同元素的个数 * @param val 相同的元素 * @param arr 传入数组 */ function getSameNum(val,arr){ processArr ...

  5. JavaScript(获取或设置html元素的宽,高,坐标)，确定和判断鼠标是否在元素内部，二级导航菜单鼠标离开样式问题解决

    设置: document.getElementById('id').style.width=value    document.getElementById('id').style.height=va ...

  6. 19 01 11 javascript 获取某一种元素(所有的标签) 以及字符串处理的方法

    获取元素方法二 可以使用内置对象document上的getElementsByTagName方法来获取页面上的某一种标签,获取的是一个选择集,不是数组,但是可以用下标的方式操作选择集里面的标签元素. ...

  7. JavaScript获取css 行间样式，内连样式和外链样式的方式

    [行间样式获取] <div id='div1' style="backgroud:red">测试</div> <script> var odiv ...

  8. jquery 获取鼠标和元素的坐标点

    获取当前鼠标相对img元素的坐标 $('img').mousemove(function(e) { varpositionX=e.pageX-$(this).offset().left; //获取当前 ...

  9. 详细解析 JavaScript 获取元素的坐标

    引言 最近突然看到了有关图片懒加载的问题,大致意思就是初始状态下页面只加载浏览器可视区域的图片,剩余图片在当浏览器可视区域滚动到其位置时才开始加载.貌似现在许多大型网站都有实现懒加载,所以我便就此问题 ...

随机推荐

  1. pta 7-1 找出不是两个数组共有的元素

    给定两个整型数组,本题要求找出不是两者共有的元素. 输入格式: 输入分别在两行中给出两个整型数组,每行先给出正整数N(≤20),随后是N个整数,其间以空格分隔. 输出格式: 在一行中按照数字给出的顺序 ...

  2. 2 Struts2的执行流程&配置文件的加载顺序

    执行流程: 访问前段页面,通过url访问action 访问xml中Struts2核心过滤器,并执行一组拦截器(这组拦截器在struts-default.xml中,实现了部分功能) 通过action配置 ...

  3. 【原】Linux中常见服务介绍

    1.SSH介绍 简单说,SSH(Secure Shell Protocol)是一种网络协议,用于计算机之间的加密登录.在默认状态下SSH服务提供俩个服务功能,一个是提供类似telnet远程联机服务器的 ...

  4. Python中self的用法

    在Python类中规定,函数的第一个参数是实例对象本身,并且约定俗成,把其名字写为self.其作用相当于java中的this,表示当前类的对象,可以调用当前类中的属性和方法. 在python中,类是通 ...

  5. 一个元素的宽度 及带padding，border，margin的各自情况

    width() - 设置或返回元素的宽度 height() - 设置或返回元素的高度 innerWidth() - 返回元素的宽度(包含 padding) innerHeight() - 返回元素的高 ...

  6. #P1099 树网的核 题解

    题目描述 pdf 题解 这一题,刚开始看题目感觉好像很难,题目又长……一看数据范围,呵呵. 已经给出来这是个DAG,所以不用担心连通性的问题.那么怎么做呢? 朴素的做法是把树的直径的两个端点都统计出来 ...

  7. 虚拟对抗训练（VAT）：一种用于监督学习和半监督学习的正则化方法

    正则化 虚拟对抗训练是一种正则化方法,正则化在深度学习中是防止过拟合的一种方法.通常训练样本是有限的,而对于深度学习来说,搭设的深度网络是可以最大限度地拟合训练样本的分布的,从而导致模型与训练样本分布 ...

  8. 跨服务器的SQL语句如何书写

    select  *  into  本地库名..表名  from  OPENDATASOURCE(                  'SQLOLEDB',                  'Data ...

  9. java课堂第一次随机测试和课件课后动手动脑问题解决（2019-9-16 ）

    一.课堂测试 1.课堂测试:花二十分钟写一个能自动生成30道小学四则运算题目的 “软件” 要求 (1)减法结果不能为负数 (2)乘法结果不得超过一百,除法结果必须为整数 (3)题目避免重复: (4)可 ...

  10. MariaDB——SQL语句分类汇总

    常用SQL语句汇总 SQL语句在所有的关系型数据库中都是通用的,算起来sql语句也是一门语言,只不过这门语言的主要操作对象是关系型的数据库,其中最常用的还是查询相关的语句. sql语句主要分为: DQ ...