<html>

<head>

    <title>位置</title>

    <style>

        .test {

            background: url("image/omeoclickimg.jpg");

        }

    </style>

    <script language="javascript" type="text/javascript">

        function c() {

            var objTop = getOffsetTop(document.getElementById("d"));//对象x位置

            var objLeft = getOffsetLeft(document.getElementById("d"));//对象y位置

            var mouseX = event.clientX + document.body.scrollLeft;//鼠标x位置

            var mouseY = event.clientY + document.body.scrollTop;//鼠标y位置

//计算点击的相对位置

            var objX = mouseX - objLeft;

            var objY = mouseY - objTop;

            clickObjPosition = objX + "," + objY;

            alert(clickObjPosition);

        }

        function getOffsetTop(obj) {

            var tmp = obj.offsetTop;

            var val = obj.offsetParent;

            while (val != null) {

                tmp += val.offsetTop;

                val = val.offsetParent;

            }

            return tmp;

        }

        function getOffsetLeft(obj) {

            var tmp = obj.offsetLeft;

            var val = obj.offsetParent;

            while (val != null) {

                tmp += val.offsetLeft;

                val = val.offsetParent;

            }

            return tmp;

        }

    </script>

</head>

<body style="margin:0px;">

<div style="padding:90px;border:1px solid #ccc;font-size:36px;width:800px;height:800px;"></div>

<div id="area"></div>

<div style="width:1400px;height:300px;border:1px solid red;padding-left:1200px;">

    <div id="d" class="test" style="width:230px;height:230px;border:1px solid green;padding:10px;cursor:hand;"

         onclick="c()"></div>

</div>

</body>

</html>

Selenium_获取相对坐标的更多相关文章

  1. JavaScript通过ID获取元素坐标

    JavaScript通过ID获取元素坐标 function getElementPos(elementId) {    var ua = navigator.userAgent.toLowerCase ...

  2. 原生js获取鼠标坐标方法全面讲解-zmq

    原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...

  3. 原生js获取鼠标坐标方法全面讲解：clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y【转】

    关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种 event.clientX/Y event.pageX/Y event.offsetX/Y event.layerX/Y event.sc ...

  4. 利用百度地图API，获取经纬度坐标

    利用百度地图API,获取经纬度坐标 代码很简单,但在网上没找到现成的获取地图经纬度的页面. 就是想,给当前页面传递一个经纬度,自动定位到此经纬度.然后可以重新选择,选择完返回经纬度. 效果如下: 源代 ...

  5. Android必知必会-获取View坐标和长宽的时机

    如果移动端访问不佳,请访问–>Github版 背景 最近要实现一个功能,用到了一些属性动画,需要获取一些View的坐标信息,设计图如下: 这里我使用的是DialogFragment来实现的,可以 ...

  6. 原生js获取鼠标坐标方法全面讲解：clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y

    关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种 event.clientX/Y event.pageX/Y event.offsetX/Y event.layerX/Y event.sc ...

  7. JAVA中经过nginx反向代理获取客户端ip并获取相关坐标等信息

    关于搜狐新浪ip库查询接口的使用 直接输出访客ip及所在城市: <script src="http://pv.sohu.com/cityjson?ie=utf-8" > ...

  8. 微信小程序 --- 获取当前坐标

    获取位置:get.location type:wgs84(是全球定位系统,获取的坐标,gcj02是国家测绘局给出的坐标) btnclick:function(){ wx.getLocation({ t ...

  9. JS 获取鼠标坐标

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. PHP保留小数位的三种方法

    /** * PHP保留两位小数的几种方法 * @link http://www.phpddt.com */ $num = 10.4567; //第一种:利用round()对浮点数进行四舍五入 echo ...

  2. 跟着鸟哥学Linux系列笔记0-如何解决问题

    跟着鸟哥学Linux系列笔记0-扫盲之概念 在发生问题怎么处理: 1.  在自己的主机.网络数据库上查询How-To或FAQ -Linux 自身的文件数据: /usr/share/doc -CLDP中 ...

  3. vim用法小节

    1.把一个文件的内容全选复制到另一个文件 方案一: gg"*yG 然后另外一个vim "*p "*是系统剪贴板寄存器 方案二: 打开另一个文件,然后输入 :r filen ...

  4. [转]svn常用命令

    谢谢原作者:http://blog.sina.com.cn/s/blog_963453200101eiuq.html 1.检出svn  co  http://路径(目录或文件的全路径) [本地目录全路 ...

  5. tcflush 功能（转）

    tcflush() 丢弃要写入引用的对象,但是尚未传输的数据,或者收到但是尚未读取的数据,取决于 queue_selector 的值: TCIFLUSH 刷新收到的数据但是不读 TCOFLUSH 刷新 ...

  6. Linux2.6 内核的 Initrd 机制解析

    文章来自:www.ibm.com/developerworks/cn/linux/l-k26initrd/ 1．什么是 Initrd initrd 的英文含义是 boot loader initial ...

  7. Java学习随笔1：Java是值传递还是引用传递？

    Java always passes arguments by value NOT by reference. Let me explain this through an example: publ ...

  8. Emacs 之窗口管理

    // */ // ]]> Emacs 之窗口管理 Table of Contents 1. Emacs 窗口相关 1.1. Emacs 里调整 window 大小 1.2. Emacs winn ...

  9. 让Web API支持$format参数的方法

    public static class WebApiConfig { public static void Register(HttpConfiguration config) { // Web AP ...

  10. js三级省市区选择

    <!doctype html> <html> <head> <meta charset="UTF-8"> <title> ...