Wie finde ich mit jQuery die absolute Position eines Elements?

398

Gibt es eine Möglichkeit, mit jQuery die absolute Position eines Elements zu ermitteln, dh relativ zum Fensteranfang?

javascript jquery

— Akshat
quelle

Antworten:

650

.offset() gibt die Versatzposition eines Elements als einfaches Objekt zurück, z.

var position = $(element).offset(); // position = { left: 42, top: 567 }

Mit diesem Rückgabewert können Sie andere Elemente an derselben Stelle positionieren:

$(anotherElement).css(position)

— Halbmond frisch
quelle

Ich vergesse diesen immer und finde deinen Beitrag wieder, wenn ich google: p

— Aren

Dies scheint nicht immer die absolute Position aufgrund von Grenzen in Grenzen usw. zurückzugeben.

— Tom

Ich verwende Chrom und das offset()gibt nicht die richtige obere Koordinate zurück. Stattdessen werden etwa 300 Pixel mehr als die oberste Koordinate des Elements im Dokument zurückgegeben. Warum??

— SoLoGHoST

Chrom, FF und IE geben unterschiedliche Ergebnisse :(

— Rizwan Mumtaz

@Aren Ich vergesse diesen immer und finde deinen Kommentar jedes Mal amüsant :)

— Alex

197

Beachten Sie, $(element).offset()dass Sie die Position eines Elements relativ zum Dokument angeben . Dies funktioniert in den meisten Fällen hervorragend, position:fixedkann jedoch zu unerwarteten Ergebnissen führen.

Wenn Ihr Dokument länger als das Ansichtsfenster ist und Sie vertikal zum unteren Rand des Dokuments gescrollt haben, ist position:fixedder offset()Wert Ihres Elements um den Betrag, den Sie gescrollt haben , größer als der erwartete Wert.

Wenn Sie nach einem Wert suchen , der sich auf das Ansichtsfenster (Fenster) bezieht , und nicht auf das Dokument an einer Position: festes Element, können Sie den scrollTop()Wert des Dokuments vom Wert des festen Elements abziehen offset().top. Beispiel:$("#el").offset().top - $(document).scrollTop()

Wenn das position:fixedübergeordnete Element des Elements das Dokument ist , möchten Sie parseInt($.css('top'))stattdessen lesen .

— Tom Auger
quelle

Ich habe genau danach gesucht! Für den Noob wie mich: Der zu subtrahierende Wert ist$(document).scrollTop()

— Dr. Gianluigi Zane Zanettini

Genial! Dies sollte die beste Antwort sein!

— Shivanshu Goyal