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 ...
随机推荐
- SQL注入之Sqli-labs系列第二十八关（过滤空格、注释符、union select）和第二十八A关
开始挑战第二十八关(Trick with SELECT & UNION) 第二十八A关(Trick with SELECT & UNION) 0x1看看源代码 (1)与27关一样,只是 ...
- 链表 c实现
linklist.h #ifndef _LINKLIST_H_ #define _LINKLIST_H_ typedef int data_t; typedef struct node{ data_t ...
- 设计精美Power BI报告的五大秘诀
众所周知,Power BI可以帮助您创建交互式且信息丰富的报告,但使用Power BI 制作精美而实用的报告对我们这群IT人员而言,却是一个巨大的痛苦:但个人觉得不能就此止步,通过不断实践练习,小悦采 ...
- php-xdebug(安装)
我虽然是前端人员,但是我也挺喜欢服务端语言的,我不是说完全不会服务端语言,主要是没有实践经验,实践经验不一样非要公司的项目,自己也可以去模仿一些项目,那也是实践的.所以就有了想法,自己写个项目,从后端 ...
- pytorch基础教程2
1. 四部曲 1)forward; 2) 计算误差 :3)backward; 4) 更新 eg: 1)outputs = net(inputs) 2)loss = criterion(outputs, ...
- php防止sql注入的方法（转）
[一.在服务器端配置] 安全,PHP代码编写是一方面,PHP的配置更是非常关键. 我们php手手工安装的,php的默认配置文件在 /usr/local/apache2/conf/php.ini,我们最 ...
- HDU 1907：John（尼姆博弈变形）
John Time Limit: 5000/1000 MS (Java/Others) Memory Limit: 65535/32768 K (Java/Others) Total Submi ...
- #include<bits/stdc++.h>的使用
#include<bits/stdc++.h>包含了C++里面所有的库函数,因此在写任何程序的时候只需要加上#include<bits/stdc++.h>即可.
- 算法训练 K好数 解析
算法训练 K好数 时间限制:1.0s 内存限制:256.0MB 提交此题 锦囊1 锦囊2 问题描述 如果一个自然数N的K进制表示中任意的相邻的两位都不是相邻的数字,那么我们就说这个数是K好数.求L位K ...
- 2017-2018-2 20165313实验三 《敏捷开发与XP实践》
实验报告封面 实验内容及步骤 实验一 1.试验要求: 参考http://www.cnblogs.com/rocedu/p/6371315.html#SECCODESTANDARD安装alibaba 插 ...