获取当前鼠标相对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. 王爽<汇编语言>实验十

    实验十 3.数值显示(以下程序附带测试程序) ;名称: dtoc ;功能: 将dword型数据转变为表示十进制数的字符串,字符串以0为结尾 ;参数: (ax)=dword型数据低字 ; (dx)=dw ...

  2. Struts2向值栈中压入属性的方式

    Struts2在初始化Action的时候会先向值栈中压入一个action对象,里面包含了各个属性,这些属性是怎么被压进去的?或者说是根据什么来压入的?直到2016年5月5日才理解,原来是在初始化act ...

  3. iOS_地图之显示附近微博

          1.首先需要新建一个MKMapView地图对象,在storyBoard中拖拽一个,在工程中导入MapKit.framework: 2.遵守MKMapViewDelegate协议,设定显示地 ...

  4. python学习笔记——2

    Python的字符串 在最新的Python 3版本中,字符串是以Unicode编码的,也就是说,Python的字符串支持多语言. 对于单个字符的编码,Python提供了ord()函数获取字符的整数表示 ...

  5. View 的 focus 和 selected 状态, TabContainer实现

    View的 isFocusableInTouchMode() 默认是 false, 需调用 setFocusableInTouchMode(true) 才为true要让 button 等 view 调 ...

  6. 文章汇总(包括NVMe SPDK vSAN Ceph xfs等)

    基础部分 NVMe驱动解析-前言 NVMe驱动解析-注册设备 NVMe驱动解析-关键的BAR空间 NVMe驱动解析-DMA传输(热门) NVMe驱动解析-响应I/O请求 用一个简单的例子窥探NVMe的 ...

  7. 一个github账户多台电脑代码提交

    在实际工作生活中,我们可能不一定仅仅在一台电脑上编码,比如:我们平时在单位电脑1上写代码,提交代码到github账户,而我们也可能会在在家里的电脑2上继续工作,提交代码,这样就是在不同的电脑上提交代码 ...

  8. log_format为Nginx设置日志格式

    nginx服务器日志相关指令主要有两条,一条是log_format,用来设置日志格式, 另外一条是access_log,用来指定日志文件的存放路径.格式和缓存大小,一般在nginx的配置文件中日记配置 ...

  9. 使用NUget发布自己的dll(转)

    一:Nuget控制台有几个常用命令 Get-Package 获取当前项目已经安装的类库 Install-Package 安装指定类库,命令格式如下:Install-Package 类库ID,示例:PM ...

  10. 每天一个 Linux 命令(18):locate 命令

    locate 让使用者可以很快速的搜寻档案系统内是否有指定的档案.其方法是先建立一个包括系统内所有档案名称及路径的数据库,之后当寻找时就只需查询这个数据库,而不必实际深入档案系统之中了.在一般的 di ...