DOM对象jQuery的XY坐标文件DOM对象jQuery的XY坐标文件(jQuery x y do

2019-05-13 11:18发布

我需要得到的X,Y坐标(相对于文档的顶部/左)DOM元素。 我无法找到可以给我举这些任何插件或jQuery的属性或方法。 我可以在上边和左边的DOM元素的,但可以是相对于当前容器/父母或记录。

Answer 1:

您可以使用尺寸插件 [弃用...列入的jQuery 1.3.2 +]

偏移()
得到相对于文档的当前第一个匹配元素的偏移量,以像素为单位。

位置()
获取元件相对于它的父偏移一个的顶部和左侧位置。

知道这一点,那么很容易...(用我的小SVG项目作为例子页 )

var x = $("#wrapper2").offset().left;
var y = $("#wrapper2").offset().top;

console.log('x: ' + x + ' y: ' + y);

输出:

x: 53 y: 177

希望它可以帮助你在找什么。

这里的)的偏移图像(和位置()

使用X光

使用Web开发工具栏



Answer 2:

我的解决办法是“变通”插件:+ d。 但工程!

jQuery.fn.getPos = function(){
        var o = this[0];
        var left = 0, top = 0, parentNode = null, offsetParent = null;
        offsetParent = o.offsetParent;
        var original = o;
        var el = o;
        while (el.parentNode != null) {
            el = el.parentNode;
            if (el.offsetParent != null) {
                var considerScroll = true;
                if (window.opera) {
                    if (el == original.parentNode || el.nodeName == "TR") {
                        considerScroll = false;
                    }
                }
                if (considerScroll) {
                    if (el.scrollTop && el.scrollTop > 0) {
                        top -= el.scrollTop;
                    }
                    if (el.scrollLeft && el.scrollLeft > 0) {
                        left -= el.scrollLeft;
                    }
                }
            }            
            if (el == offsetParent) {
                left += o.offsetLeft;
                if (el.clientLeft && el.nodeName != "TABLE") {
                    left += el.clientLeft;
                }
                top += o.offsetTop;
                if (el.clientTop && el.nodeName != "TABLE") {
                    top += el.clientTop;
                }
                o = el;
                if (o.offsetParent == null) {
                    if (o.offsetLeft) {
                        left += o.offsetLeft;
                    }
                    if (o.offsetTop) {
                        top += o.offsetTop;
                    }
                }
                offsetParent = o.offsetParent;
            }
        }
        return {
            left: left,
            top: top
        };
    };

用法:

var p = $("#wrapper2").getPos();
alert("top:"+p.top+"; left:"+p.left);


Answer 3:

该偏移功能会为你做的。

下面是他们给出的例子:

var p = $("p:last");
var offset = p.offset();
p.html( "left: " + offset.left + ", top: " + offset.top );


文章来源: jQuery x y document coordinates of DOM object