获取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 ...
随机推荐
- iOS6 自动布局 入门–Auto Layout
目前为止,即使你的界面设计是在合理的复杂度内,你也必须要为之写许多代码来适应变化的布局.现在我相信你会很高兴听到这种情况将不会发生了-对于iPhone与iPad IOS6 带来了一个非常了不起的特征: ...
- SSH使用总结(xml配置)
beans.xml <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="htt ...
- GDI与OpenGL与DirectX之间的区别
图形编程的几种技术对比: GDI,图形设备接口,MS开发的通用的windows系统图形编程接口,功能强涉及面广,一般的编程都用它.但是用来做多媒体开发就差强人意了 OPENGL是SGI开发的一套三维图 ...
- redis key设计技巧
把表名转换为key前缀, 第二端放置表用于区分区key的字段–对应mysql中的主键的列名如userid. 3.放置主键值,如1,2,3,…..,a,b,c. 4.放要存储的列名 user表 user ...
- TStrings的一些技巧(转)
TStrings是一个抽象类,在实际开发中,是除了基本类型外,应用得最多的.常规的用法大家都知道,现在来讨论它的一些高级的用法.先把要讨论的几个属性列出来:1.CommaText2.Delimiter ...
- Java基础知识复习(一)
- JVM内存区域 程序计数器:一个比较小的内存区域,用于指示当前线程所执行的字节码执行到了第几行,是线程隔离的. Java虚拟机栈:Java方法执行的内存模型,用于存储局部变量,操作数栈,动态链接, ...
- Manager Test and DAO
1. 阅读ManagerTest代码 (1)代码 import java.util.* package test; /** * This program demonstrates inheritanc ...
- 蓝桥杯 算法训练 ALGO-36 传纸条
算法训练 传纸条 时间限制:1.0s 内存限制:512.0MB 问题描述 小渊和小轩是好朋友也是同班同学,他们在一起总有谈不完的话题.一次素质拓展活动中,班上同学安排做成一个m行n列的矩阵,而 ...
- Linux盘符漂移问题
Linux管理多块磁盘时(以sata盘为例),会按磁盘加载的顺序依次给磁盘命名为/dev/sda, /dev/sdb... 这种命名规则就会导致,一块磁盘在发生热插拔或系统重启后,盘符可能发生变化,会 ...
- 安装jenkins 的时候 记录默认密码文件为空的情况
1.把文件的权限改成 chmod 777 .jenkins/secrets/initialAdminPassword 然后再使用编辑器打开,密码就出来的 密码文件的地址 /var/root/.hud ...