首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

jquery 获取鼠标和元素坐标

获取当前鼠标相对img元素坐标 $('div').mousemove(function(e) { varpositionX=e.pageX-$(this).offset().left;...//获取当前鼠标相对divX坐标 varpositionY=e.pageY-$(this).offset().top; //获取当前鼠标相对divY坐标 console.log...(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(); 实例中是获取对象右下角位置,创建新窗口顶部位置。

2.3K41
您找到你想要的搜索结果了吗?
是的
没有找到

js获取鼠标当前位置坐标

2017-03-01 10:08:42 在页面中获取鼠标坐标通常有三种方式,这三种方式各有不同,所值也是不一样。  首先是相对于页面的pageX和pageY。...他值是鼠标在页面上可视区域位置,从浏览器可视区域左上角开始,即是以浏览器滑动条此刻滑动到位置为参考点,随滑动条移动 而变化。 相对于屏幕来说screenX/screenY。...这是一个IE特有的属性,鼠标相比较于触发事件元素位置,以元素盒子模型内容区域左上角为参考点,如果有boder,可能出现负值 相对于坐标layerX/layerY。...FF特有,鼠标相比较于当前坐标位置,即如果触发元素没有设置绝对定位或相对定位,以页面为参考点,如果有,将改变参考坐标系,从触发元素盒子模型border区域左上角为参考点也就是当触发元素设置了相对或者绝对定位后...完全支持所有属性.其中(offsetX和layerX都是以border为参考点) 下面这个是获取相对于屏幕坐标 document.onmousemove = function(e) { e =

14.5K20

js获取元素几种形式

通过id获取元素 document.getElementById('div');//获取id为div元素 通过class获取 document.getElementsByClassName('top'...);//获取页面中所有的class为top元素集合 通过标签名获取 document.getElementsByTagName('p');//获取页面中所有的标签为p元素集合 通过name获取 document.getElementsByName...('user');//获取页面中所有的name为user元素集合 注意:通过class,name标签名抓取元素是一个集合,即使该类只有一个符合要求元素目标,也返回是一个集合,因此可以存储变量,通过变量名...[0]获得第一个符合要求标签目标....简单可以将返回的当做一个存储符合数组,通过下标进行找到指定位置. 当然也可以使用数组方法返回,集合目标数. alert(tops.length)可以提示出class为top目标数

25.2K30

jquery获取第几个子元素_js获取元素指定子元素

可以这样理解,页面中元素有相同元素 ,并且里面又包含li元素,那么就取第一个li元素,每个子类集合都要进行判断,直到找出所有符合要求li元素; :last-child:这个也与上面相对了,...An+B所有子节点,比如3n+1返回所处位置为父节点子元素是3倍数加1那个子元素; :even:页面范围内处于偶数位置元素,如:li:even返回全部偶数li元素; :odd:页面范围内处于奇数位置元素...(n):第n个匹配元素(不包括)之后元素(n从0开始),如:ul:gt(2)返回从第3个ul开始所有ul元素(含第三个); :lt(n):第n个匹配元素(不包括)之前元素(n从0开始),如:ul...F所有子元素(F可以为E子类子类,甚至更远); E>F:匹配父元素E下所有标签名为F直接子元素; E+F:匹配所有标签名为F元素,并且有E类型兄弟节点在该F元素之前(E,F紧挨着); E~...C等效于*.C; E#I:匹配id为I所有元素E,#I等效于*#I; E[A]:匹配带有属性A所有元素E; E[A=V]:匹配所有属性A值为V元素E; E[A^=V]:匹配所有元素E,且A属性值是

27K30

js获取元素到文档区域document(横向、纵向)坐标的两种方法

获取页面中元素到文档区域document横向、纵向坐标的两种方法及其比较 在js控制元素运动过程中,对于页面元素坐标位置获取是经常用到,这里主要总结下两种方法: 一:通过叠加元素对象和它offsetParent...js代码: // 获取元素到文档区域坐标 function getPosition(element) { var actualLeft = element.offsetLeft, actualTop...js代码: // 获取元素到文档区域坐标 function getPosition(element){ var dc = document, rec = element.getBoundingClientRect...(), _x = rec.left, // 获取元素相对浏览器视窗window左、上坐标 _y = rec.top; // 与html或body元素滚动距离相加就是元素相对于文档区域document...结语:上文已对如何获取元素相对于文档区域document坐标位置做出了阐述,如遇到相关问题,可联系本人或直接发表评论,另外,对于右坐标right以及下坐标bottom获取只需把left、top坐标的大小和元素本身宽度

2.5K30

js获取元素样式之getComputedStyle方法

习惯了jquery同学应该都知道获取元素样式方式可以直接写成(obj).css(style);更方便获取高度宽度等一些样式可以直接使用(obj).height()和 一、 getComputedStyle...是什么 getComputedStyle是一个可以获取当前元素所有最终使用CSS属性值。...为什么要用这个属性呢,是因为通过document.getElementById(element).style.xxx可以获取元素样式信息但是对于通过class属性引用外部样式表就获取不到了。...但是getComputedStyle属性是只读属性,只能读属性,不能设置,但是他可以获取元素最终样式信息。...例如,我们要获取一个元素高度,可以类似下面的代码: alert((element.currentStyle?

22.5K30

js获取屏幕以及元素宽高方法

网页被卷去高:document.body.scrollTop 网页被卷去左:document.body.scrollLeft 三.滚动相关 scrollHeight: 获取对象滚动高度。...scrollWidth: 获取对象滚动宽度 document.documentElement.scrollTop 垂直方向滚动值 四.位置精确定位 scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容最左端之间距离...scrollTop:设置或获取位于对象最顶端和窗口中可见内容最顶端之间距离 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定坐标的计算左侧位置 offsetTop...:获取对象相对于版面或由 offsetTop 属性指定坐标的计算顶端位置 五.坐标轴 event.clientX 相对文档水平座标 event.clientY 相对文档垂直座标 event.offsetX...相对容器水平坐标 event.offsetY 相对容器垂直坐标 六.width/clientWidth/offsetWidth以及height之间区别 width是指可见内容宽 height是指可见内容

6.7K20

js、jQuery 获取文档、窗口、元素各种值

; 获取元素宽度:clientWidth;(width+padding) 获取元素高度:clientHeight;(height+padding) 获取元素宽度:offsetWidth;(width...).scrollLeft(); 获取或设置元素宽度:$(obj).width();(width) 注意只是元素宽度,不包括padding 获取或设置元素高度:$(obj).height();(height...) 注意只是元素高度,不包括padding 获取或设置元素宽度:$(obj).innerWidth(); (width + padding) 获取或设置元素高度:$(obj).innerHeight...Y值) 注意clientY和pageY区别,pageY在页面无滚动条或滚动条下拉0情况下值等同于clientY event.offsetX 相对容器水平坐标 event.offsetY...相对容器垂直坐标 layerY: 如果元素position样式不是默认static,我们说这个元素具有定位属性。

14K32

JS offsetParent属性:获取最近上级定位元素

js中,offsetParent 属性表示最近上级定位元素。...要获取相对父级元素位置,可以先判断 offsetParent 属性是否指向父元素,如果是,则直接使用 offsetLeft 和 offsetTop 属性获取元素相对于父元素距离;否则分别获得当前元素和父元素距离窗口坐标...//获取指定元素距离父元素左上角偏移坐标//参数:e表示获取位置元素//返回值:返回对象直接量,其中属性x表示x轴偏移距离,属性y表示y轴偏移距离function getP (e) { if..."x" : x, "y" : y },}下面调用该扩展函数获取指定元素相对父元素偏移坐标。...var box = document.getElementById("box");var o = getP (box); //调用扩展函数获取元素对应父元素偏移坐标console.log(o.x);

7.6K40

JS和JQuery获取当前元素兄弟及父级等元素方法

jQuery获取: jQuery.parent(expr),找父亲节点,可以传入 expr 进行过滤,比如 $("span").parent() 或者 $("span").parent(".class"...) jQuery.parents(expr),类似于 jQuery.parents(expr) ,但是是查找所有祖先元素,不限于父元素 jQuery.children(expr),返回所有子节点,这个方法只会返回直接孩子节点...,而 jQuery.find(),返回结果,不会有初始集合中内容,比如 $("p").find("span") ,是从 元素开始找 ,等同于 $("p span") JS获取:...;   //获得s最后一个子节点 JS获取节点父级,子级元素JS方法会比JQUERY麻烦很多,主要则是因为FF、谷歌浏览器会把你换行也当作DOM元素:空text元素,目前IE也是这样       原生JS获取ID为test元素元素

12.4K10

Android MotionEvent 坐标获取

Android MotionEvent中getX()与getRawX()都是获取屏幕坐标(横),但二者又有区别 getX()           :   是获取相对当前控件(View)坐标...getRawX()   :   是获取相对显示屏幕左上角坐标 演示示例代码 Java代码: public class MainActivity extends Activity implements...点击屏幕中间Button,获取坐标信息: ?...结果说明: x,y  :  分别获取相对Button控件坐标 getX(), getY() rawX,rawY  : 分别获取相对显示屏幕左上角坐标 getRawX(), getRawY() 总结...:  getX() 是表示Widget相对于自身左上角x坐标,而getRawX()是表示相对于屏幕左上角x坐标值(注意:这个屏幕左上角是手机屏幕左上角,不管activity是否有titleBar或是否全屏幕

1.9K30
领券