JS获取坐标

1.js获取对象的绝对坐标 方法1:

function   getAbsPoint(e)
{
    var   x   =   e.offsetLeft,   y   =   e.offsetTop;
    while(e=e.offsetParent)
    {
       x   +=   e.offsetLeft;
       y   +=   e.offsetTop;
    }
    alert("x:"+x+","+"y:"+y);
}

方法2:

function   getAbsPoint(obj)
{
  var   x,y;
  oRect   =   obj.getBoundingClientRect();
  x=oRect.left;
  y=oRect.top;
  alert("("+x+","+y+")")
}

JS中获得窗口属性的方法
1。获得屏幕的分辨率:

screen.width
screen.height

2。获得窗口大小:

document.body.clientWidth
document.body.clientHeight

3。获得窗口大小(包含Border、Scroll等元素)

document.body.offsetWidth
document.body.offsetHeight 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script>
        function getScreen(e) {
            var x = e.screenX - e.clientX;
            var y = e.screenY - e.clientY;
            alert("X坐标:" + x + ",Y坐标:" + y);
        }
    </script>
</head>
<body>
    <input type="button" onclick="getScreen(event)" value="测试" />
</body>
</html>
时间: 2024-08-01 22:24:31

JS获取坐标的相关文章

js获取鼠标坐标位置兼容多个浏览器

这个看似简单的获取坐标功能,可是已经花费我一天时间了,白天一直搜索js获取坐标,找了很多很多,一一检验,结果出现不兼容.真的够烦躁了,但是事情还是要继续,要完成,回来又继续实践,搜索,反复操作,发现自己好多不会呀,特别是jquery自定义方法(函数),根本就不会,很欠缺基础,心里暗暗下决心,弄完这个好好学习一下js,不然老是卡在这方面.时间虽然已经过去很久了,但我还是没有放弃,想想换个关键词搜索一下,是不是可以找到我想要的.搜索“js获取坐标兼容ie8”,一下子出现后几条,于是挑选一个实践,改造

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

原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:event.clientX/Yevent.pageX/Yevent.offsetX/Yevent.layerX/Yevent.screenX/Y 二.分别讲解如下: clientX/Y: clientX/Y获取到的是触发点相对浏览器可视区域左上角距离,不随页面滚动而改变 兼容性:所有浏览器均支持 page

js获取鼠标移动坐标

js获取鼠标移动坐标,很多情况下还需要考虑document.documentElement.scrollLeft . document.documentElement.clientLeft; var _touchstart, _touchend,_touchmove; var isPC=window.ontouchstart===undefined; if(isPC){ _touchstart="mousedown"; _touchmove="mousemove";

js获取鼠标坐标实例

js获取鼠标坐标实例,关键代码如下: 1.js 代码 /*显示坐标*/ function showTip(obj){ //if(!$.trim($(obj).html())) // return false; var event=window.event; var element=event.srcElement; //var X = $(obj).position().top; //var Y = $(obj).position().left; //alert(X+","+Y); v

js 获取元素坐标 和鼠标点击坐标

js 获取元素的位置 var odiv=document.getElementById('divid'); alert(odiv.getBoundingClientRect().left); alert(odiv.getBoundingClientRect().top); js 获取点击时间鼠标坐标 event = event||window.event; //获得相对于body定位的横标值: x=event.clientX //获得相对于body定位的纵标值: y=event.clientY

js获取元素的页面坐标

一.DOM中各种宽度.高度 二.DOM中的坐标系 JS获取div元素的宽度 offsetWidth=width+padding-left+padding-right+border-left+border-right,即offsetWidth描述的是元素的宽度,是指元素的宽度+内边距(左右两个)+边框(左右两个),不包括外边距和滚动条部分 offsetHeight=height+padding-top+padding-bottom+border-top+border-bottom,即offsetH

JS获取网页中HTML元素的几种方法分析

getElementById getElementsByName getElementsByTagName 大概介绍 getElementById ,getElementsByName ,getElementsByTagName ###adv### 后两个是得到集合,byid只是得到单个对象 getElementById 的用法 举个例子: <a id="link1" name="link1" href=http://homepage.yesky.com>

js获取页面的宽度

JS如何获取屏幕浏览器网页高度宽度网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body.offsetWidth (包括边线的宽)网页可见区域高:document.body.offsetHeight (包括边线的宽)网页正文全文宽:document.body.scrollWidth网页正文全文高:document.body.scrollHeight网页被卷去的高:docume

js 获取浏览器高度和宽度值

js 获取浏览器高度和宽度值 IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度 FireFox中: document.body.clientWidth ==> BODY