Ich habe ein Element mit id="stimulus" in einem HTML-Dokument.
Wenn ich dieses Dokument in einem Browser öffne und die Browser-Konsole verwende, um die Eigenschaften von #stimulus zu untersuchen, sehe ich Folgendes:
Wie soll ich das interpretieren? Wie ist top in offset anders als top , auf das mit der css Methode zugegriffen wird?
Von der offset () -Dokumentation stammt der Versatz vom Anfang des Dokuments; während die oberen und linken CSS-Eigenschaften relativ zum übergeordneten Element sind. Vielleicht möchten Sie sich die Position () ansehen, um den Offset relativ zum Offset-Elternteil .
Offset ist die Position innerhalb der ganzen Seite
css top positioniert das Element relativ zu seinem nächstliegenden Vorfahren. Dieser Vorfahr könnte irgendwo auf der Seite sein und so passen Offset und Top nicht zusammen, es sei denn, es gibt keinen positionierten Vorfahren.
Sie haben wahrscheinlich diesen Unterschied der Ergebnisse erhalten, weil id="stimulus" animiert wurde und Sie console.log in verschiedenen Frames sendeten. Oder das Element ist tatsächlich "statisch" und hat einige andere Eigenschaften, die seinen offset() Standort ändern.
Wie
Aus jQuerys Dokumentation .offset() :
Mit der Methode
.offset()können wir die aktuelle Position eines Elements relativ zum Dokument abrufen. Vergleichen Sie dies mit.position(), wodurch die aktuelle Position relativ zum übergeordneten Offset abgerufen wird.
Die Methode .css() abstrahiert das native CSSStyleDeclaration API , die die Position relativ zum übergeordneten Element zurückgibt, aber nur, wenn sie explizit in CSS angegeben ist . Wenn Sie das wollen, dann verwenden Sie .position() anstelle von .offset() .
Tags und Links javascript html jquery css offset