获取HTML元素位置--js学习笔记
对于不同的元素,不同的浏览器,offsetParent含义不同,有时,指的是直接包含的元素,有时指的是HTML元素,有时不存在offsetParent.
如果所研究的元素没有offsetParent,仅计算该元素自身的偏移位置,否则要将元素的偏移值加到元素的offsetParent偏移值,再重复上面步骤,一级一级递归。
function getPosition(theElement){
var positionX = 0;
var positionY = 0;
while(theElement != null){
positionX += theElement.offsetLeft;
positionY += theElement.offsetTop;
theElement = theElement.offsetParent;
}
return [positionX,positionY];
}
Mac下的IE5还考虑了body页变空白或边框距,精确地度量尺度,应该使body上的页边空白和边框距为0.
获取HTML元素位置--js学习笔记的更多相关文章
- Vue.js学习笔记:在元素 和 template 中使用 v-if 指令
f 指令 语法比较简单,直接上代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " ...
- JS学习笔记5_DOM
1.DOM节点的常用属性(所有节点都支持) nodeType:元素1,属性2,文本3 nodeName:元素标签名的大写形式 nodeValue:元素节点为null,文本节点为文本内容,属性节点为属性 ...
- 基于jquery的插件turn.js学习笔记
基于jquery的插件turn.js学习笔记 简介 turn.js是一个可以实现3d书籍展示效果的jq插件,使用html5和css3来执行效果.可以很好的适应于ios和安卓等触摸设备. How it ...
- 2019-4-29 js学习笔记
js学习笔记一:js数据类型 1:基本数据类型 number类型(整数,小数) String类型 boolean类型 NaN类型其实是一个nu ...
- 【转】Backbone.js学习笔记(二)细说MVC
文章转自: http://segmentfault.com/a/1190000002666658 对于初学backbone.js的同学可以先参考我这篇文章:Backbone.js学习笔记(一) Bac ...
- WebGL three.js学习笔记 加载外部模型以及Tween.js动画
WebGL three.js学习笔记 加载外部模型以及Tween.js动画 本文的程序实现了加载外部stl格式的模型,以及学习了如何把加载的模型变为一个粒子系统,并使用Tween.js对该粒子系统进行 ...
- JS 学习笔记--9---变量-作用域-内存相关
JS 中变量和其它语言中变量最大的区别就是,JS 是松散型语言,决定了它只是在某一个特定时间保存某一特定的值的一个名字而已.由于在定义变量的时候不需要显示规定必须保存某种类型的值,故变量的值以及保存的 ...
- WebGL three.js学习笔记 使用粒子系统模拟时空隧道(虫洞)
WebGL three.js学习笔记 使用粒子系统模拟时空隧道 本例的运行结果如图: 时空隧道demo演示 Demo地址:https://nsytsqdtn.github.io/demo/sprite ...
- WebGL three.js学习笔记 法向量网格材质MeshNormalMaterial的介绍和创建360度全景天空盒的方法
WebGL学习----Three.js学习笔记(5) 点击查看demo演示 Demo地址:https://nsytsqdtn.github.io/demo/360/360 简单网格材质 MeshNor ...
随机推荐
- Bean后置处理器 BeanPostProcessor
1.BeanPostProcessor接口的作用 Bean后置处理器允许在调用初始化方法前后对Bean进行额外的处理,Bean后置处理器对IOC容器的所有bean实例逐一处理,而非单一实例. 我们可以 ...
- Quartz数据库脚本
QRTZ_CALENDARS 以 Blob 类型存储 Quartz 的 Calendar 信息 QRTZ_CRON_TRIGGERS 存储 Cron Trigger,包括 Cron表达式和时区信息 ...
- 为什么中国出不了facebook和Twitter?
我们坐拥全球最大基数的网民,我们拥有让人骄傲的四大发明,我们有有流传全世界的孙子兵法,可是在互联网时代,我们却落后了.互联网可以说是江山人才辈辈出,各领风骚三两年. 让我们来简单地回顾一下近几年的互联 ...
- 程序4-4 chmod函数实例
//http://blog.chinaunix.net/uid-24549279-id-71355.html /* ========================================== ...
- java多线程-------------基础的Thread.CURRNET
总结:感觉不是太难,不过我写出来了,但竟然不理解它的意思?多线程就是多个任务同时进行 public class Test2 { public static void main(String[] arg ...
- 分布式缓存系统 Memcached 哈希表操作
memcached 中有两张hash 表,一个是“主hash 表”(primary_hashtable),另外一个是“原hash 表”(old_hashtable).一般情况下都在主表中接受操作,在插 ...
- DB2的安装
jiangxin@db01:~$ su – root #切换到root用户 密码: root@db01:~# uname -a #查看内核和操作系统信息 Linux db01 4.4.0-66-gen ...
- vue-cli中的ESlint配置文件eslintrc.js详解
本文讲解vue-cli脚手架根目录文件.eslintrc.js eslint简介 eslint是用来管理和检测js代码风格的工具,可以和编辑器搭配使用,如vscode的eslint插件 当有不符合配置 ...
- BGP基本配置的方法
边界网关协议(BGP)是运行于 TCP 上的一种自治系统的路由协议. BGP 是唯一一个用来处理像因特网大小的网络的协议,也是唯一能够妥善处理好不相关路由域间的多路连接的协议. as100 as200 ...
- DDD学习笔录——提炼问题域之知识提炼与协作的基本原则
1.通过通用语言达成共识 通用语言,已经强调过好多遍了,在DDD再怎么重视都不为过,后面可能还会讲. 知识提炼的输出以及共识的构建就是常见的通用语言(UL). 当与业务相关人员和主题专家进行建模时,每 ...