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;
<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">
<!--
body,div { margin:0; padding:0;}
-->
</style>
<script type="text/javascript" src="js/jquery.js"></script>
<body>
<div style="background:#ccc;height:300px;" onclick=""></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>
JQuery 获得绝对,相对位置的坐标方法的更多相关文章
- JQuery 获得div绝对,相对位置的坐标方法
获取页面某一元素的绝对X,Y坐标 var X = $('#DivID').offset().top; var Y = $('#DivID').offset().left; 获取相对(父元素)位置: v ...
- jQuery 学习笔记（4）（文本值相关方法、操控CSS方法、位置和尺寸方法）
1.文本值相关方法 .html() == .innerHTML $("div").html("<span> ...</span>") / ...
- 深入学习jQuery元素尺寸和位置操作
× 目录 [1]尺寸设置 [2]位置设置 前面的话 对于javascript来说,元素尺寸有scroll.offset.client三大属性,以及一个强大的getBoundingClientRect( ...
- [DOM Event Learning] Section 3 jQuery事件处理基础 on(), off()和one()方法使用
[DOM Event Learning] Section 3 jQuery事件处理基础 on(),off()和one()方法使用 jQuery提供了简单的方法来向选择器(对应页面上的元素)绑定事件 ...
- Android View各种尺寸位置相关的方法探究
Android View各种尺寸位置相关的方法探究 本来想做一个View间的碰撞检测之类的. 动手做了才发现不是想象的那么简单. 首先,写好了碰撞检测的工具类如下: package com.mengd ...
- jQuery 的选择器常用的元素查找方法
jQuery 的选择器常用的元素查找方法 基本选择器: $("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myE ...
- jquery css事件编程 位置 操作
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Jquery中each的三种遍历方法
Jquery中each的三种遍历方法 $.post("urladdr", { "data" : "data" }, function(dat ...
- 原生js获取鼠标坐标方法全面讲解-zmq
原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...
随机推荐
- 使用 Word 2013 维护博客
博客的发布.修改是一件非常耗时.耗精力的事情.借助 Word 2013,维护博客将变得非常简单. 1 新建博客文章 运行 Word 2013,新建文档.如下图所示: 图1 鼠标左键单击上图的" ...
- windows8如何显示开始菜单
按键盘上的Win+R 运行,输入regedit打开注册表 2 在注册表中找到HKEY_CURRENT_USER\Software\Microsoft\Windows\CurrentVersion\Ex ...
- （水题）洛谷 - P1553 - 数字反转（升级版） - 字符串格式转换
https://www.luogu.org/problemnew/show/P1553 忘记给整数加上前导零去除的代码了.其实不去也可以,额外的进位用一个carry另外存起来就好. #include& ...
- hdoj1166【线段树】
单点更新+区间求和 不多说,直接上渣code--- #include<cstdio> #include<iostream> #include<string.h> # ...
- hdoj1272 小希的迷宫
并查集 = =.一开始判断连通,没有判断环,后来判断了环,没有判断连通... 还有就是一开始是0 0,也是Yes,有道理么?我不是很懂.. #include <iostream> #inc ...
- python 类装饰器
class Test(): def __init__(self, func): print('装饰器1') self.__func = func def __call__(self): print(' ...
- kettle 导入xml 资源文件
Repository | ExploreRight click the root node of the repositorySelect Import objects from an XML fil ...
- 洛谷 P2216 [HAOI2007]理想的正方形 || 二维RMQ的单调队列
题目 这个题的算法核心就是求出以i,j为左上角,边长为n的矩阵中最小值和最大值.最小和最大值的求法类似. 单调队列做法: 以最小值为例: q1[i][j]表示第i行上,从j列开始的n列的最小值.$q1 ...
- MessageDigest简介(与MD5加密有关)
参考文章:http://blog.sina.com.cn/s/blog_4f36423201000c1e.html 参考来源:http://blog.csdn.net/hudashi/article/ ...
- Eclipse的ant调用maven
需要在 eclipse 的 windows - preferences - ant - runtime - classpath - global entries 加入 eclipse 里面的 jsch ...