<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title></title>

<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>

<script type="text/javascript">

function GetPosition(obj){

}

$(function(){

    $(".div1").click(function(event){

            event.stopPropagation();

            //var obj = $(".div1")[0];

            var obj = $(this)[0];

            var left = 0;

            var top   = 0;

            while(obj != document.body){

                left = obj.offsetLeft + left;

                top   = obj.offsetTop + top;

                obj = obj.offsetParent;

            }

            alert("Left : " + left + "\r\n" + "Top : " + top);

    });

});

</script>

<style type="text/css">

*{margin:0px;padding:0px;}

.div1{

    position:relative;

    background:#fcc;

    border-bottom:solid 1px #000;

    border-left:solid 1px #f00;

    left:200px;

}

</style>

</head>

<body>

<h3>得到当前对象在不同大小的页面中的绝对位置，及冒泡cancelBubble</h3>

<br><br><br><br>

<input type="button" value="btn" id="btn">

<div class="div1">div000

    <div class="div1">div1

    </div>

    <div class="div1">div111

    </div>

    <div class="div1">div11133

    </div>

    <div class="div1">div1114

    </div>

    <div class="div1">div1115

        <div class="div1">div111511

        </div>

        <div class="div1">div111511

        </div>

    </div>

    <div class="div1">div1116

    </div>

</div>

</body>

</html>

得到当前对象在不同大小的页面中的绝对位置，及冒泡cancelBubble的更多相关文章

  1. Java常量,变量,对象(字面量)在JVM内存中的存储位置

    Java常量,变量,对象(字面量)在JVM内存中的存储位置 2019-02-26 18:13:09 HD243608836 阅读数 540  收藏 更多 分类专栏: JAVA jvm   苦苦研究了快 ...

  2. 工作总结 返回 json 后台对象中，某一个字段设为string 整个对象转换为json 返回到页面中

    JsonRequestBehavior.AllowGet作用 若要允许 GET 请求,请将 JsonRequestBehavior 设置为 AllowGet MVC 默认 Request 方式为 Po ...

  3. javascript基础之javascript的存在形式和js代码块在页面中的存放位置

    1.存在形式 文件 如: <script src='js/jc.js'></script> 前页面 <script type='text/javascript'>a ...

  4. getBoundingClientRect方法获取元素在页面中的相对位置

    获取元素位置可以用 offset 或 getBoundingClientRect,使用 offset 因为兼容性不好,比较麻烦,offset获取位置会形成"回溯".而 getBou ...

  5. js基础之javascript的存在形式和js代码块在页面中的存放位置和 CSS 对比

    1.存在形式 文件 如: <script src='js/jc.js'></script> 前页面 <script type='text/javascript'>a ...

  6. JavaScript脚本在页面中放置的位置

    JavaScript脚本通常放置在三个位置: 1.head部分JavaScript脚本. 2.body部分JavaScript脚本. 3.单独以.js结尾的文件中的JavaScript脚本. 客户端会 ...

  7. js实现点击按钮显示某个区域 然后点击页面中任意其他位置，隐藏该区域

    $(".licat-header-list").on("click",function(e){ $(this).addClass("active&qu ...

  8. C# Eval在aspx页面中的用法及作用

    Eval( " ")和Bind( " ") 这两种一个单向绑定,一个双向绑定,bind是双向绑定,但需数据源支持 ASP.NET 2.0改善了模板中的数据绑定操 ...

  9. MVC中 _ViewStart _Layout Index三个页面中的加载顺序

    MVC学习中忽然想到一个问题.. 在访问一个Index.cshtml页面时, MVC的加载顺序是怎么样的呢? 首先说下我的结论 . _ViewStart.cshtml . Index.cshtml . ...

随机推荐

  1. java中 static,final,transient,volatile关键字的作用

    static 和final static  静态修饰关键字,可以修饰 变量,程序块,类的方法: 当你定义一个static的变量的时候jvm会将将其分配在内存堆上,所有程序对它的引用都会指向这一个地址而 ...

  2. hdu1166 敌兵布阵 树状数组/线段树

    数列的单点修改.区间求和 树状数组或线段树入门题 #include<stdio.h> #include<string.h> ],N; void add(int x,int a) ...

  3. vault 集群搭建（active standby 模式)

        参考架构图: consul server cluster 搭建 consul 基本配置格式 { "server": true, "node_name": ...

  4. ExtJs 4.0 DeskTop集成 百度地图API

    经过3天的奋斗最终搞了出来, 网上的资料非常少,希望小⑦的文章对读者有点帮助,PS:小⑦非常努力的~. 不废话,上代码了. 首先.去百度官网Copy一个模版 http://api.map.baidu. ...

  5. 走进windows编程的世界-----消息处理函数（1）

    Win32消息机制     过程驱动:程序是依照我们预先定义好的顺序运行.每运行一步,下一步都已经依照预定的顺序 继续运行,直至程序结束.     事件驱动:程序的运行顺序是无序的.某个时间点所运行的 ...

  6. Spark的启动进程详解

    Master和Worker是执行任务之前存在的进程 (类似于公司) Driver和Excutor是任务执行之后存在的进程(类似于公司接到项目后才成立的项目小组) 启动步骤: 启动Master资源管理进 ...

  7. Oracle误删除表空间的恢复

    对于误删除表空间的恢复,本文通过基于数据库的时间点恢复和基于表空间的时间点恢复分别加以讨论 一 通过基于数据库的时间点恢复被误删除的表空间 1 需要注意的事项 a 基于数据库的时间点恢复将会回退整个数 ...

  8. Python中的类(classes)

    Python的类机制使用尽可能少的新语法和语义将类引入语言.python的类提供了面向对象程序设计语言所有的 标准特性:类继承机制允许有多个基类,一个派生类可以覆盖基类中的任何方法,一个方法可以使用相 ...

  9. SpringCloud初体验：六、利用 Sleuth 和 Zipkin 给微服务加上链路监控追踪查看功能

    首先:装上 Zipkin 服务,收集调用链跟踪数据,体验时装在了本机docker上, 方便快捷 docker run -d -p : openzipkin/zipkin 安装后访问地址也是 9411端 ...

  10. windows环境下把Python代码打包成独立执行的exe可执行文件

    有时候因为出差,突然急需处理一批数据.虽然写好的脚本存储在云端随用随取,然而编译的环境还需要重新搭建,模块也需要重新装载,从头到尾这么一遍下来,也是要花费可观的时间成本的. 有没有什么办法,可以让.p ...