获取页面中任意一个元素距离body的偏移量
offSet:等同于jQuery中的offSet方法,获取页面中任意一个元素距离body的偏移量
function offSet(curEle) {
var totalLeft = null;
var totalTop = null;
var par = curEle.offsetParent;
//首先把自己本身的相加
totalLeft += curEle.offsetLeft;
totalTop += curEle.offsetTop;
//现在开始一级一级往上查找,只要没有遇到body,我们就把父级参照物的边框和偏移相加
while (par){
if (navigator.userAgent.indexOf("MSIE 8.0") === -1){
//不是IE8我们才进行累加父级参照物的边框
totalTop += par.clientTop;
totalLeft += par.clientLeft;
}
//把父级参照物的偏移相加
totalTop += par.offsetTop;
totalLeft += par.offsetLeft;
par = par.offsetParent;
}
return {left: totalLeft,top: totalTop};
//返回一个数组,方便我们使用哦。
}
获取页面中任意一个元素距离body的偏移量的更多相关文章
- ××校招:前端线上笔试题--页面中的一个元素(10px*10px)围绕坐标(200, 300) 做圆周运动
题目: 请让页面中的一个元素(10px*10px)围绕坐标(200, 300) 做圆周运动: 原理: 1.页面上画一个圆,画一个圆心.在这个圆的圆周上面画一个点,我们就让这个点绕着圆周跑: 2.怎 ...
- js在页面中添加一个元素 —— 添加弹幕
参考地址 [往下拉 —— 使用HTML DOM appendChild() 方法实现元素的添加 ] 一.创建 HTML <div class="right_liuyan"&g ...
- 请让页面中的一个元素(10px*10px)围绕坐标(200, 300) 做圆周运动
<!DOCTYPE html> <html> <head> <title>Making things move</title> <me ...
- jQuery基础学习5——JavaScript方法获取页面中的元素
给网页中的所有<p>元素添加onclick事件 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN& ...
- JS基础入门篇( 三 )—使用JS获取页面中某个元素的4种方法以及之间的差别( 一 )
1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...
- js 获取任意一个元素的任意一个样式属性的值
//谷歌,火狐支持console.log(window.getComputedStyle(my$("dv"),null).left);//IE8支持console.log(my$( ...
- 获取一个元素距离顶部的位置和window的滚动值
获取一个元素距离顶部的位置: $(".box").offset().top; 获取window的滚动值: $(window).scrollTop();
- (一)在HTML页面中实现一个简单的Tab
在HTML页面中实现一个简单的Tab 为了充分利用有限的HTML页面空间,经常会采用类似与TabControl的效果通过切换来显示更多的内容.本文将采用一种最为简单的方法来实现类似如Tab页切换的效果 ...
- js获取页面中图片的总数
查看效果:http://keleyi.com/keleyi/phtml/image/9.htm 下面是完整代码: <html><body><div id="ke ...
随机推荐
- Jq对象与dom对象的互相转换!
JQ对象转化成dom对象 var a=$('div'); var b=a[0];//dom对象 转化成dom对象以后就可以使用dom方法了 dom对象转化成jq对象 var a=document.ge ...
- C++第五天学习
回顾: 1.友元 friend 2.运算符重载 类型 operator运算符(参数表) 抽象.封装 类是面向对象程序设计中最基本的概念 类的背后隐藏的思想是数据抽象和封装 是进行封装和数据隐藏的工具, ...
- ThinkPHP URL伪静态、路由规则、重写、生成
一.URL规则 1.默认是区分大小写的 2.如果我们不想区分大小写可以改配置文件 'URL_CASE_INSENSITIVE'=>true,//url不区分大小写 ...
- DNS没有生效的几个原因
1.记录没有正确添加 请确认你的域名记录是否完全正确的添加.线路类型正确,记录类型正确 2.域名还没有生效 这个情况还会有另外一个现象,就是域名有时候可以ping,有时候不能ping. 这是因为你当地 ...
- 用ant打包可运行的jar文件 (将第三方jar包放进你自己的jar包)
http://blog.csdn.net/caiqcong/article/details/7618582 <span style="font-family:SimSun;font-s ...
- java算法 蓝桥杯 扶老奶奶街
一共有5个红领巾,编号分别为A.B.C.D.E,老奶奶被他们其中一个扶过了马路. 五个红领巾各自说话: A :我和E都没有扶老奶奶 B :老奶奶是被C和E其中一个扶过大街的 C :老奶奶是被我和D其中 ...
- python 的日志相关应用
python日志主要用logging模块; 示例代码如下: #coding:utf-8 import logging class logger(): ''' %(asctime)s %(filenam ...
- 定时任务管理中心(dubbo+spring)-我们到底能走多远系列47
我们到底能走多远系列47 扯淡: 又是一年新年时,不知道上一年你付出了多少,收获了多少呢?也许你正想着老板会发多少奖金,也许你正想着明年去哪家公司投靠. 这个时间点好好整理一下,思考总结一下,的确是个 ...
- Xamarin 小试牛刀 通知栏消息通知和按钮(基于Java代码人肉转换)
本示例基于网友现有安卓项目人肉翻译,在Xamarin中替换和修改了很多方法的命名,比如某些属性需要去掉getName的get前缀, 有些方法名称需要使用Pascal命名法替换Java的Camel 命名 ...
- MyBatis中多对多关系的映射和查询
先说一下需求: 在页面上显示数据库中的所有图书,显示图书的同时,显示出该图书所属的类别(这里一本书可能同时属于多个类别) 创建表: 笔者这里使用 中间表 连接 图书表 和 图书类别表,图书表中 没有使 ...