<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

<style>

*{ margin:0; padding:0}

div {padding: 40px 50px;}

#div1 {background: red;position: relative;}

#div2 {background: green; position: relative;}

#div3 {background: orange; position: relative;}

</style>

<script>

window.onload = function() {

    var oDiv3 = document.getElementById('div3');

    var p = getPos( oDiv3 );

    //alert( p.left );

    alert( p.top );

    function getPos(obj) {

        var pos = {left:0, top:0};//Jason

        while (obj) {

            pos.left += obj.offsetLeft;

            pos.top += obj.offsetTop;

            obj = obj.offsetParent;

        }

        return pos;

    }

}

</script>

</head>

<body id="body1">

    <div id="div1">

        <div id="div2">

            <div id="div3"></div>

        </div>

    </div>

</body>

</html>

getPos封装的更多相关文章

  1. 封装一些常用的js工具函数-不定时更新（希望大家积极留言，反馈bug^_^）

    /*华丽------------------------------------------------------------------------------------------------ ...

  2. 总结的一些封装好的javascript函数

    平时总结的一些常用javascript函数封装: //获取样式 function getStyle(obj,name){ if(obj.currentStyle){ return obj.curren ...

  3. 00-Unit_Common综述-RecyclerView封装

    自学安卓也有一年的时间了,与代码相伴的日子里,苦乐共存.能坚持到现在确实已见到了"往日所未曾见证的风采".今2018年4月2日,决定用一个案例:Unit_Common,把安卓基础的 ...

  4. [C#] 简单的 Helper 封装 -- RegularExpressionHelper

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  5. iOS开发之App间账号共享与SDK封装

    上篇博客<iOS逆向工程之KeyChain与Snoop-it>中已经提到了,App间的数据共享可以使用KeyChian来实现.本篇博客就实战一下呢.开门见山,本篇博客会封装一个登录用的SD ...

  6. Ajax实现原理，代码封装

    都知道实现页面的异步操作需要使用Ajax,那么Ajax到是怎么实现异步操作的呢? 首先需要认识一个对象 --> XMLHttpRequest 对象 --> Ajax的核心.它有许多的属性和 ...

  7. 用C语言封装OC对象（耐心阅读，非常重要）

    用C语言封装OC对象(耐心阅读,非常重要) 本文的主要内容来自这里 前言 做iOS开发的朋友,对OC肯定非常了解,那么大家有没有想过OC中NSInteger,NSObject,NSString这些对象 ...

  8. 【知识必备】RxJava+Retrofit二次封装最佳结合体验，打造懒人封装框架~

    一.写在前面 相信各位看官对retrofit和rxjava已经耳熟能详了,最近一直在学习retrofit+rxjava的各种封装姿势,也结合自己的理解,一步一步的做起来. 骚年,如果你还没有掌握ret ...

  9. 对百度WebUploader开源上传控件的二次封装,精简前端代码(两句代码搞定上传)

    前言 首先声明一下,我这个是对WebUploader开源上传控件的二次封装,底层还是WebUploader实现的,只是为了更简洁的使用他而已. 下面先介绍一下WebUploader 简介: WebUp ...

随机推荐

  1. 汇编学习（三）——汇编语言程序入门

    一.寻址方式 1.概念: 一条指令由操作码和操作数构成,操作码是系统定义好的符号,执行指定的操作,操作数即是指令的对象,而寻址方式就是操作数的指定方式 操作码 目的操作数,源操作数 2.寻址方式的三种 ...

  2. MySQL的多表查询(笛卡尔积原理)

    先确定数据要用到哪些表. 将多个表先通过笛卡尔积变成一个表. 然后去除不符合逻辑的数据(根据两个表的关系去掉). 最后当做是一个虚拟表一样来加上条件即可. 注意:列名最好使用表别名来区别. 笛卡尔积 ...

  3. chrome插件

    自备FQ神器,或者在公司浏览谷歌商店.话说我们公司电脑可以打开谷歌商店. 1.Performance-Analyser(网页性能分析) 这款插件是用来分析你的网页加载性能的,包括http请求,执行期的 ...

  4. rman归档删除

    rman: delete [all] input 数据库oracle 11g 全备脚本如下:rman target /  <<EOFrun {allocate channel t1 typ ...

  5. jenkins+ant+jmeter搭建持续集成的接口测试平台

    一.jemter接口脚本的编写步骤如下: 1. 编写接口请求 通过录制或者查看接口文档,编写接口请求,进行调试,确保接口调试通过,对于http的请求来说,就是正确的填写域名,查询字符串,查询参数等信息 ...

  6. 获取iframe的元素并进行操作

    获取iframe中的document元素有一下集中方法: 1.getElementById()方法和contentWindow属性: window.onload=function(){ /*必须等待页 ...

  7. JavaScript 的同源策略

    同源策略限制了一个源(origin)中加载文本或脚本与来自其它源(origin)中资源的交互方式. 同源定义 如果两个页面拥有相同的协议(protocol),端口(如果指定),和主机,那么这两个页面就 ...

  8. three.js右手坐标系， 显示和线条

    1.右手坐标系 Threejs使用的是右手坐标系,这源于opengl默认情况下,也是右手坐标系.下面是右手坐标系的图例,如果对这个概念不理解,可以百度一下,我保证你伸出手比划的那一瞬间你就明白了,如果 ...

  9. 【BZOJ3450】Tyvj1952 Easy 期望DP

    [BZOJ3450]Tyvj1952 Easy Description 某一天WJMZBMR在打osu~~~但是他太弱逼了,有些地方完全靠运气:(我们来简化一下这个游戏的规则有n次点击要做,成功了就是 ...

  10. objective-c 通过类名实例化类

    NSString *myClassName = @"MainScene"; Class myClass = NSSClassFromString(myClassName);