<!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. touch事件（寻找触摸点 e.changedTouches）

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  2. cglib 多重 代理示例-2

    from:  http://thinkinjava.cn/2018/10/%E4%BD%BF%E7%94%A8-Cglib-%E5%AE%9E%E7%8E%B0%E5%A4%9A%E9%87%8D%E ...

  3. Transformer-view java实体 转换视图 Lists.transform

    自: https://blog.csdn.net/mnmlist/article/details/53870520 meta_ws 连接: https://github.com/kse-music/d ...

  4. LG2731 骑马修栅栏 Riding the Fences

    题意 John是一个与其他农民一样懒的人.他讨厌骑马,因此从来不两次经过一个栅栏.你必须编一个程序,读入栅栏网络的描述,并计算出一条修栅栏的路径,使每个栅栏都恰好被经过一次.John能从任何一个顶点( ...

  5. 读取地址C语言

    就是黑点820要算的16位地址(A B C D E F) ************************************************************ C语言中要输出地址时 ...

  6. 来自官方的一些dbt 最佳实践

    限制对原始数据的依赖性 您的项目将取决于存储在数据库中的原始数据.我们建议制作所谓的“基本模型”,以最大限度地减少对原始数据表的依赖性.在此约定中,基本模型可以具有以下职责: 仅选择与当前分析相关的字 ...

  7. Mysql ON子句和USING子句

    Mysql ON子句和USING子句   Mysql 中联接SQL语句中,ON子句的语法格式为:table1.column_name = table2.column_name. 当模式设计对联接表的列 ...

  8. 00.嵌入式Linux开发环境搭建

     3.虚拟机上网配置 虚拟机如果要从网上获取资源,就要能够访问外网.虚拟机有三种上网方式:桥接上网,NAT上网,单主机模式[没用过].本节从原理和操作2个方面讲了NAT方式和桥接方式这2种不同的虚拟机 ...

  9. hadoop之 参数调优

    一. hdfs-site.xml 配置文件 1. dfs.blocksize 参数:hadoop文件块大小描述:新文件的默认块大小,以字节为单位,默认 134217728 字节.可以使用以下后缀(大小 ...

  10. mysql 中find_in_set()和in()用法比较

    mysql 中find_in_set()和in()用法比较 在mysql中in可以包括指定的数字,而find_in_set()用于特定的数据类型. find_in_set 函数使用方法 个例子来说:有 ...