<!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. JPA 简单实体映射和EntityManagerAPI

    [常用注解] 使用JPA 指定映射关系时,有两种方式,一种是使用xml 方式,另一种是注解方式,笔者推荐使用注解方式.在JPA 映射简单实体时,常用的注解如下: @Entity:修饰实体类对象,表示该 ...

  2. hdu 5185 dp(完全背包)

    BC # 32 1004 题意:要求 n 个数和为 n ,而且后一个数等于前一个数或者等于前一个数加 1 ,问有多少种组合. 其实是一道很水的完全背包,但是没有了 dp 的分类我几乎没有往这边细想,又 ...

  3. jdreact相关操作注意事项

    1:sublime 安装 babel 插件可以 识别react代码,变色,使用javascipt(babel): 2:热更新:import React, {Component } from 'reac ...

  4. 实习第二天-String对象的不可变性-未解决

    public class Reverse { public static void main(String[] args) { String c1=new String("abc" ...

  5. C语言命令行解析函数:getopt/getopt_long

    命令行工具下的参数选项有两种,长选项和短选项.短选项以-开头,后面跟单个字母:长选项以--开头,后面可跟多个字母. 一. getopt() 1.功能:解析命令行短选项参数 2.函数原型: #inclu ...

  6. 二叉搜索树的第k大的节点

    题目 给定一颗二叉搜索树,请找出其中的第k大的结点. 思路 如果中序遍历一棵二叉搜索树,遍历序列的数值则是递增排序,因此只需中序遍历一个二叉搜索树即可. #include <iostream&g ...

  7. 【转】每天一个linux命令(37):date命令

    原文网址:http://www.cnblogs.com/peida/archive/2012/12/13/2815687.html 在linux环境中,不管是编程还是其他维护,时间是必不可少的,也经常 ...

  8. POJ1631 LIS模板

    题目:http://poj.org/problem?id=1631 两种nlogn的方法. 1.树状数组优化暴力.有种扫描线的感觉,以时间保证位置,把值作为数组脚标. 2.记录长为...的上升子序列末 ...

  9. 2013-7-27 802.1X学习

    最近搭了企业级加密的server 2003服务器,教程完全google,无任何自主创新.折腾了一周,总算搞定了,同时也验证了server 2003下的TLS和PEAP0加密算法是正常的. 至于搭建se ...

  10. ALGO-5_蓝桥杯_算法训练_最短路

    记: 一开始没接触过关于最短距离的算法,便开始翻阅关于图的知识, 得知关于最短距离的算法有Dijkstra算法(堆优化暂未看懂),Bellman-Ford算法,Floyd算法,SPFA算法. 由于数据 ...