获取当前鼠标相对img元素的坐标
  1. $('img').mousemove(function(e) {
  2. varpositionX=e.pageX-$(this).offset().left; //获取当前鼠标相对img的X坐标
  3. varpositionY=e.pageY-$(this).offset().top; //获取当前鼠标相对img的Y坐标
  4. console.log(positionX+'   '+positionY);
  5. })
获取当前鼠标相对浏览器的原点的坐标      
  1. $('img').mousemove(function(e) {
  2. var xx = e.originalEvent.x ||e.originalEvent.layerX || 0;
  3. var yy = e.originalEvent.y ||e.originalEvent.layerY || 0;
  4. console.log(xx+'   '+yy);
  5. })
获取当前鼠标相对html页面的原点的坐标         
  1. $('img').mousemove(function(e) {
  2. var pageX=e.pageX;
  3. var pageY=e.pageY;
  4. console.log(pageX+'   '+pageY);
  5. })

1,获取对象
var obj = $("#image");

2,获取对象元素的位置(offset()方法)
var offset = obj.offset();
获取对象元素的位置,分别是元素的top和left,调用方法是:offset.left和offset.top,可知当前对象的左部和顶部位置。

3,获取对象元素的宽度(width()方法)
var right = offset.left+obj.width();
实例中是获取对象的右下角位置,创建新窗口的左部位置。

4,获取对象元素的高度(height()方法)
   var down =offset.top+obj.height();
实例中是获取对象的右下角位置,创建新窗口的顶部位置。

5.获取对象相对于父元素的位置(position()方法)                      
  var x = obj.position().top;                                  
  var y =obj.position().left;
  1. <scripttype="text/javascript">
  2. $(document).ready(function(){
  3. alert($(window).height());//浏览器当前窗口可视区域高度
  4. alert($(document).height());//浏览器当前窗口文档的高度
  5. alert($(document.body).height());//浏览器当前窗口文档body的高度
  6. alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度包括border padding margin
  7. alert($(window).width());//浏览器当前窗口可视区域宽度
  8. alert($(document).width());//浏览器当前窗口文档对象宽度
  9. alert($(document.body).width());//浏览器当前窗口文档body的高度
  10. alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度包括border padding margin
  11. })
  12. </script>

jquery 获取鼠标和元素的坐标点的更多相关文章

  1. jquery如何获得页面元素的坐标值

    http://www.cnblogs.com/pansly/archive/2011/05/25/2056222.html jquery如何获得页面元素的坐标值   yulutxt是输入经典语录的输入 ...

  2. jquery获取和设置元素高度宽度

    jquery获取和设置元素高度宽度 1.height()/ width() 取得第一个匹配元素当前计算的高度/宽度值(px) height(val)/ width(val) 为每个匹配的元素设置CSS ...

  3. jQuery获取或设置元素的宽度和高度

    jQuery获取或设置元素的宽度和高度: 可使用以下3种方法: 1,jQuery width() 和 height() 方法: 2,innerWidth() 和 innerHeight() 方法: 3 ...

  4. jquery获取含有某元素的的控件 “控件名[属性名=值]”

    jquery获取含有某元素的的控件 “控件名[属性名=值]”. 如,获取 <input id="${cheackbox}" data-role="icheck&qu ...

  5. jquery获取的html元素和document获取的元素的区别

    最近通过ocx做了一个视频插件,然后将插件放到html中(想知道的可以看一下) 因为我要操作这个插件,要播放,停止等,所以我需要获取这个元素,不出意外的,我就用jquery来获取,然后根本无法执行,然 ...

  6. 利用jQuery获取鼠标当前的坐标

    文字来源:http://www.smalluv.com/jquery_code_106.html jQuery获取当前鼠标坐标位置: <div id="testDiv"> ...

  7. Jquery取得iframe中元素的几种方法Javascript Jquery获取Iframe的元素、内容或者ID

    query取得iframe中元素的几种方法 在iframe子页面获取父页面元素代码如下: $('#objId', parent.document);// 搞定... 在父页面 获取iframe子页面的 ...

  8. coding++:JS/jQuery获取兄弟姐妹等元素

    jQuery获取: jQuery.parent(expr),找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span") ...

  9. JQuery 获取父级元素、同级元素、子元素等

    例: <div> <div id="div_1">这是内容1</div> <div id="div_2">这是内 ...

随机推荐

  1. uva 12169

    /* 巨大的斐波那契数列_________________________________________________________________________________ #inclu ...

  2. sae flask 微信公众平台开发

    index.wsgi启动服务文件 import sae from evilxr import app application = sae.create_wsgi_app(app) evilxr.py ...

  3. 排序算法练习--JAVA(插入、直接选择、冒泡、快速排序、非递归快速排序)

    排序算法是数据结构中的经典算法知识点,也是笔试面试中经常考察的问题,平常学的不扎实笔试时候容易出洋相,回来恶补,尤其是碰到递归很可能被问到怎么用非递归实现... package sort; impor ...

  4. PetaPoco ORM 增加返回DataTable的方法

    public DataTable ExecuteDataTable(Sql sql) { return ExecuteDataTable(sql.SQL, sql.Arguments); } publ ...

  5. linux下查看系统信息

    lspci:   这个工具用来查看所有连接到pci总线上的所有设备信息. 如果有些系统没有lspci,安装后即可使用,有些老死的版本中需要root权限才可使用. 一些用法: lspci    列出所有 ...

  6. u-boot-2010.09移植(B)

    前面我们的u-boot只是在内存中运行,要想在nandflash中运行,以达到开机自启的目的,还需作如下修改 一.添加DM9000网卡支持 1.修改board/fl2440/fl2440.c中的boa ...

  7. ajaxpro 异步调用

    AjaxPro一般默认是同步调用,异步调用只需要在方法后面加一个callback函数,直接取value属性即可.例如: MyNameSpace.Page1.getOtherConfig("A ...

  8. Eclipse搭建SSH(Struts2+Spring+Hibernate)框架教程

    | 版权声明:本文为博主原创文章,未经博主允许不得转载. 前言 确实,刚创博客,对于这个陌生的东西还是有些许淡然.这是我的第一篇博文,希望能给你们有帮助,这就是我最大的乐趣! 好了下面进入正题: SS ...

  9. OPENVPN

    安装 方法1--源码安装yum -y install  pam pam-devel gcc gcc-c++ lzo lzo-devel openssl openssl-devel wget autom ...

  10. linux 删除进程的多种方法

    kill pid kill -9 pid kill -15 pid pkill -f *.php kill -s 9 pid