js获取触发事件元素在整个网页中的绝对坐标(示例代码)


Posted in Javascript onDecember 13, 2013

如下所示:

 //返回数组类型
        function findPosition(oElement) {//oElement 当前元素
            if (typeof (oElement.offsetParent) != 'undefined') {
                for (var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent) {
                    posX += oElement.offsetLeft;
                    posY += oElement.offsetTop;
                }
            }
            var array = [posX, posY];
            return array;
        }
        //获取触发事件的控件在整个页面的绝对的X坐标
        function findPositionX(oElement) {
            if (typeof (oElement.offsetParent) != 'undefined') {
                for (var posX = 0; oElement; oElement = oElement.offsetParent)
                {
                    posX += oElement.offsetLeft;
                }
            }
            return posX;
        }
        //获取触发事件的控件在整个页面的绝对的Y坐标
        function findPositionY(oElement) {
            if (typeof (oElement.offsetParent) != 'undefined') {
                for (var posY = 0; oElement; oElement = oElement.offsetParent) {
                    posY += oElement.offsetTop;
                }
            }
            return posY;
        }
Javascript 相关文章推荐
JavaScript中对象属性的添加和删除示例
May 12 Javascript
JavaScript实现的多种鼠标拖放效果
Nov 03 Javascript
一波JavaScript日期判断脚本分享
Mar 06 Javascript
js中通过getElementsByName访问name集合对象的方法
Oct 31 Javascript
详解前后端分离之VueJS前端
May 24 Javascript
Node.js 中使用 async 函数的方法
Nov 20 Javascript
浅谈Vue SPA 首屏加载优化实践
Dec 15 Javascript
Vue $mount实战之实现消息弹窗组件
Apr 22 Javascript
js实现无缝滚动双图切换效果
Jul 09 Javascript
微信小程序 腾讯地图显示偏差问题解决
Jul 27 Javascript
深入理解Vue keep-alive及实践总结
Aug 21 Javascript
vue el-table实现自定义表头
Dec 11 Javascript
浅析XMLHttpRequest的缓存问题
Dec 13 #Javascript
xmlhttp缓存清除的2种解决方法
Dec 13 #Javascript
js获取url参数代码实例分享(JS操作URL)
Dec 13 #Javascript
js获取html页面节点方法(递归方式)
Dec 13 #Javascript
jquery 合并内容相同的单元格(示例代码)
Dec 13 #Javascript
javascript读取xml实现javascript分页
Dec 13 #Javascript
同域jQuery(跨)iframe操作DOM(示例代码)
Dec 13 #Javascript
You might like
用php获取本周,上周,本月,上月,本季度日期的代码
2009/08/05 PHP
php处理文件的小例子(解压缩,删除目录)
2013/02/03 PHP
PHP中读取照片exif信息的方法
2014/08/20 PHP
linux下为php添加iconv模块的方法
2016/02/28 PHP
PHP实现对文件锁进行加锁、解锁操作的方法
2017/07/04 PHP
PHP实现浏览器格式化显示XML的方法示例
2019/01/22 PHP
jQuery 相关控件的事件操作分解
2009/08/03 Javascript
js parentElement和offsetParent之间的区别
2010/03/23 Javascript
Ajax搜索结果页面下方的分页按钮的生成
2012/04/05 Javascript
jQuery阻止事件冒泡具体实现
2013/10/11 Javascript
jquery实现表格中点击相应行变色功能效果【实例代码】
2016/05/09 Javascript
RequireJS多页面应用实例分析
2016/06/29 Javascript
jquery的父、子、兄弟节点查找,节点的子节点循环方法
2016/12/07 Javascript
js编写三级联动简单案例
2016/12/21 Javascript
利用Vue.js实现求职在线之职位查询功能
2017/07/03 Javascript
VueJs组件prop验证简单介绍
2017/09/12 Javascript
浅谈redux, koa, express 中间件实现对比解析
2019/05/23 Javascript
通过js给网页加上水印背景实例
2019/06/17 Javascript
js里面的变量范围分享
2020/07/18 Javascript
vue-quill-editor 自定义工具栏和自定义图片上传路径操作
2020/08/03 Javascript
js实现随机点名
2021/01/19 Javascript
[08:06]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Elephant 选手采访
2021/03/11 DOTA
Python实现替换文件中指定内容的方法
2018/03/19 Python
python实现excel读写数据
2021/03/02 Python
python 3.6.2 安装配置方法图文教程
2018/09/18 Python
python斐波那契数列的计算方法
2018/09/27 Python
Python3查找列表中重复元素的个数的3种方法详解
2020/02/13 Python
python字符串,元组,列表,字典互转代码实例详解
2020/02/14 Python
Python return语句如何实现结果返回调用
2020/10/15 Python
html5使用canvas画三角形
2014/12/15 HTML / CSS
美国时尚大码女装购物网站:Avenue
2019/05/24 全球购物
卡骆驰英国官网:Crocs英国
2019/08/22 全球购物
多媒体编辑专业毕业生推荐信
2013/11/05 职场文书
购房协议书范本
2014/04/11 职场文书
团队执行力培训心得体会
2015/08/15 职场文书
MySQL入门命令之函数-单行函数-流程控制函数
2021/04/05 MySQL