代码如下:

<!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. Servlet 学习(五)

    重定向redirect 1.使用方法 response.sendRedirect("/应用名/ 访问资源名"); response.sendRedirect(request.get ...

  2. 吴裕雄--天生自然PYTHON爬虫:使用Scrapy抓取股票行情

    Scrapy框架它能够帮助提升爬虫的效率,从而更好地实现爬虫.Scrapy是一个为了抓取网页数据.提取结构性数据而编写的应用框架,该框架是封装的,包含request异步调度和处理.下载器(多线程的Do ...

  3. Python爬取51job实例

    用Python爬取51job里面python相关职业.工作地址和薪资. 51job上的信息 程序代码 from bs4 import BeautifulSoup from urllib.request ...

  4. Linux centosVMware shell编程 for循环、while循环、break跳出循环、continue结束本次循环、exit退出整个脚本

    一.for循环 语法:for 变量名 in 条件; do …; done 案例1 #!/bin/bash sum=0 for i in `seq 1 100` do sum=$[$sum+$i] ec ...

  5. Linux centosVMware运行告警系统、分发系统-expect讲解、自动远程登录后,执行命令并退出、expect脚本传递参数、expect脚本同步文件、指定host和要同步的文件、shell项目-分发系统-构建文件分发系统、分发系统-命令批量执行

    一运行告警系统 创建一个任务计划crontab -e 每一分钟都执行一次 调试时把主脚本里边log先注释掉 再次执行 没有发现502文件说明执行成功了,每日有错误,本机IP 负载不高 二.分发系统-e ...

  6. Linux centosVMware NFS exportfs命令、NFS客户端问题、FTP介绍、使用vsftpd搭建ftp

    一.exportfs命令 常用选项 -a 全部挂载或者全部卸载 -r 重新挂载 -u 卸载某一个目录 -v 显示共享目录 以下操作在服务端上 vim /etc/exports //增加 /tmp/ 1 ...

  7. MySQL的默认隔离级别的实现依赖于MVCC和锁,准确点说就是一致性读和锁。

    MySQL的默认隔离级别的实现依赖于MVCC和锁,准确点说就是一致性读和锁.

  8. ch3 盒模型、定位

    标准盒模型.怪异盒模型 外边距叠加 当两个或者争夺垂直外边距相遇时,他们将形成一个外边距,这个外边距的高度等于两个发生叠加的外边距的高度中的较大者. 当一个元素出现在另一个元素上面时,第一个元素的底外 ...

  9. redis服务器性能优化

    1.系统内存OOM优化 vm.overcommit_memory Redis会占用非常大内存,所以通常需要关闭系统的OOM,方法为将“/proc/sys/vm/overcommit_memory”的值 ...

  10. 【读书圈】win7 定时发送OA邮件

    因为win7任务计划本身xls邮件调用有问题,会显示只读权限 我用vbs脚本替代了它的邮件功能!(我现在对vbs的CDO概念也没大弄清,还不知道需不需要外网,等我找台别的内网机器试试) (另外我试验了 ...