<!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. 51Nod 1090： 3个数和为0

    1090 3个数和为0  基准时间限制:1 秒 空间限制:131072 KB 分值: 5 难度:1级算法题  收藏  关注 给出一个长度为N的无序数组,数组中的元素为整数,有正有负包括0,并互不相等. ...

  2. 2015 PHP框架调查结果出炉，Laravel最受欢迎！

    日前,SitePoint花了一个月时间进行了有关PHP框架使用情况的调查,通过调查结果所示,无论是在团队项目还是个人项目:无论是国家或是年龄层次,Laravel都是使用最多的一款框架. 其中,最流行的 ...

  3. IntelliJ IDEA 2017激活

    最新更新: 在激活Jetbrains旗下任意产品的时候选择激活服务器 填入以下地址便可成功激活 http://idea.liyang.io 点击help→Register→License sever ...

  4. 使用C＃和MSMQ开发消息处理程序

    简介 MSMQ(微软消息队列)是Windows操作系统中消息应用程序的基础,是用于创建分布式.松散连接的消息通讯应用程序的开发工具.消息队列和电子邮件有着很多相似处,他们都包含多个属性,用于保存消息, ...

  5. Python自动发邮件——smtplib和email库和yagmail库

    ''' 一.先导入smtplib模块 导入MIMEText库用来做纯文本的邮件模板 二.发邮件几个相关的参数,每个邮箱的发件服务器不一样,以163为例子百度搜索服务器是 smtp.163.com 三. ...

  6. mac os 里的 JAVA_HOME

    google了一下,发现了这篇文章Important Java Directories on Mac OS X(https://developer.apple.com/library/content/ ...

  7. MySQL架构设计谈：从开发规范、选型、拆分到减压(转)

    作者介绍 李辉,原新浪爱彩票运维负责人,常用网名:门牙没了.曾主导新浪爱彩票的MySQL运维工作.培训合伙人.资深讲师,中国科学院大学在读研究生(大数据方向),擅长大型项目的关系型数据库运维和管理,现 ...

  8. django orm 常用查询筛选

    大于.大于等于 __gt 大于 __gte 大于等于 User.objects.filter(age__gt=10) // 查询年龄大于10岁的用户 User.objects.filter(age__ ...

  9. Oracle备份提示，EXP-00091: 正在导出有问题的统计信息。

    EXP-00091: 正在导出有问题的统计信息 点我,点我~

  10. WPF Demo9外部资源文件

    <Window x:Class="Demos.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/ ...