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>
JS获取坐标的更多相关文章
- js获取鼠标坐标位置兼容多个浏览器
这个是IE 11 下兼容下视图测试时可用. $(window).bind('beforeunload', function (event) { var _this = this; var x = ev ...
- 原生js获取鼠标坐标方法全面讲解-zmq
原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...
- js点击获取—通过JS获取图片的绝对对坐标位置
一.通过JS获取鼠标点击时图片的相对坐标位置 源代码如下所示: <!DOCTYPE html> <html lang="en"> <head> ...
- js点击获取—通过JS获取图片的相对坐标位置
一.通过JS获取鼠标点击时图片的相对坐标位置 源代码如下所示: <!DOCTYPE html> <html lang="en"> <head> ...
- js 获取元素坐标 和鼠标点击坐标
js 获取元素的位置 var odiv=document.getElementById('divid'); alert(odiv.getBoundingClientRect().left); aler ...
- js获取元素的页面坐标
一.DOM中各种宽度.高度 二.DOM中的坐标系 JS获取div元素的宽度 offsetWidth=width+padding-left+padding-right+border-left+borde ...
- js获取移动端触摸坐标
想在touchmove事件里监听手指按下的坐标,event.pageX获取的是undefined,changedTouches,targetTouches,touches也只获得到了鼠标按下时的坐标, ...
- JS 获取浏览器窗口大小
JS 获取浏览器窗口大小 <script> // 获取窗口宽度 if (windows.innerWidth) { winWidth = windows.innerWidth; } els ...
- JS 获取浏览器和屏幕宽高等信息代码
JS 获取浏览器和屏幕宽高等信息. 网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:doc ...
随机推荐
- spring boot热启动
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring- ...
- 【linux基础】vim快速移动光标至行首行尾、第一行和最后一行
前言 使用vim的过程中想要快速移动光标至行首.行尾.第一行.最后一行或者某一行,本文对此简单介绍. 具体操作 1.快速至当前行的行首: 1) Home键: 2) 数字0: 3) 符号^; 2.快 ...
- Cocos2dx 中的点击事件
简单记录一下2dx的鼠标交互事件.以及精灵绑定盒的点击判定 Layer 子类的 init方法中: auto listener = EventListenerTouchOneByOne::cre ...
- (4)django的新手三件套(返回页面、返回字符、重定向)
from django.shortcuts import render,HttpResponse,redirect 新手三件套,前期开发都会用到 render #向浏览器返回页面 HttpResp ...
- hello1分析
1:选择hello1文件夹并单击“打开项目”.展开“Web页”节点,然后双击该index.xhtml文件以在编辑器中查看它. 该index.xhtml文件是Facelets应用程序的默认登录页面.在典 ...
- 《DSP using MATLAB》Problem 5.21
证明: 代码: %% ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ...
- hdu3374 String Problem KMP+最大最小表示法
Give you a string with length N, you can generate N strings by left shifts. For example let consider ...
- AangularJS过滤器详解
(参考angular权威指南) 过滤器: 用来格式化需要展示给用户的数据: 使用过滤器的方式: (1)$scope.name=$filter("lowercase").(&qu ...
- 【BZOJ4552】【TJOI2016】【HEOI2016】排序
经验还是不够…… 原题: 在2016年,佳媛姐姐喜欢上了数字序列.因而他经常研究关于序列的一些奇奇怪怪的问题,现在他在研究一个难题 ,需要你来帮助他.这个难题是这样子的:给出一个1到n的全排列,现在对 ...
- linux之nagios安装教程
我的系统环境是centos7,其它系统应该也差不多,只是有几条命令可能需要换种写法 下面是我用到的命令 363 yum install -y gcc gcc-c++ httpd php php-gd ...