JQuery 获得绝对,相对位置的坐标方法

获取页面某一元素的绝对X,Y坐标，可以用offset()方法：（body属性设置margin :0;padding:0;）

var X = $('#DivID').offset().top;
var Y = $('#DivID').offset().left;
获取相对(父元素)位置:
var X = $('#DivID').position().top;
var Y = $('#DivID').position().left;

复制代码代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>java Test</title>
</head>
<style type="text/css">

</style>
<script type="text/javascript" src="js/jquery.js"></script>

<body>
<div style="background:#ccc;height:300px;" οnclick=""></div>
<div style="position:relative;">
<div style=" position:absolute;left:50px; top:50px;" id="DivID"></div>
</div>
<script type="text/javascript">
var X = $('#DivID').offset().top;
var Y = $('#DivID').offset().left;
document.write(X+"<br />");
document.write(Y+"<br />");
//获取相对(父元素)位置:
var C = $('#DivID').position().top;
var D = $('#DivID').position().left;
document.write(C+"<br />");
document.write(D);
</script>
</body>
</html>

转载于:https://www.cnblogs.com/telwanggs/p/7723814.html

JQuery 获得绝对,相对位置的坐标方法相关推荐

WPF获取相对位置、坐标的方法
原文:WPF获取相对位置.坐标的方法 1.获取鼠标在控件中的坐标: 1 private void item_MouseDown(object sender, MouseButtonEventArgs ...
Java黑皮书课后题第8章：*8.21（中心城市）给定一组城市，中心城市是和其它所有城市具有最短距离的城市。编写一个程序，提示用户输入城市数目以及位置（坐标），找到中心城市以及与其他城市总距离
*8.21(中心城市)给定一组城市,中心城市是和其它所有城市具有最短距离的城市.编写一个程序,提示用户输入城市数目以及位置(坐标),找到中心城市以及与其他城市总距离题目题目描述与运行示例破题代 ...
为什么jQuery或诸如getElementById之类的DOM方法找不到元素？
本文翻译自:Why does jQuery or a DOM method such as getElementById not find the element? What are the poss ...
原生js与jQuery显示隐藏div的几种方法
原生Js与jQuery显示隐藏div的几种方法简介:本文将会讲解,如何使用原生的JS和jquery来实现对于这个div盒子的隐藏 js 方式一首先是进行js演示和讲解. 首先是display的方法 ...
使用jquery获取url及url参数的方法
[开发笔记]-使用jquery获取url及url参数的方法使用jquery获取url以及使用jquery获取url参数是我们经常要用到的操作 1.jquery获取url很简单,代码如下: windo ...
笔记--jQuery常用API，事件，其他方法
1. jQuery 选择器 1.1 jQuery 基础选择器原生js获取元素方式很多,很杂,而且兼容性情况不一致,因此jQuery给我们做了封装,使获取元素统一标准. 1.2 jQuery 层级选择 ...
ABB机器人：基于现场通信方式向西门子PLC发送实时位置数据的方法
本文已经首发在个人微信公众号:工业机器人仿真与编程(微信号:IndRobSim),欢迎关注! 概述在ABB机器人系统集成项目中,很多时候由于控制需求,我们需要对机器人的实时位置进行监控,这样就需要机 ...
如何查询CAD图纸中具体位置的坐标？
CAD绘图设计工作中,我们有时候会为了绘制出精准的CAD图纸,需要查询CAD图纸中具体位置的坐标.这时候有没有方便好用的查询方法呢?小编今天就给大家详细的演示一下,如何查询CAD图纸中具体位置 ...
计算节点位置的基本方法
计算节点位置的基本方法在传感器节点定位过程中,通常根据未知节点(被监测节点)相对相邻信标节点的距离.角度进行计算位置.通常采用三边测距法.三角测距法或极大似然估计法进行计算. 三边测距法(Trila ...

JQuery 获得绝对,相对位置的坐标方法

JQuery 获得绝对,相对位置的坐标方法相关推荐

最新文章

热门文章