Ich habe ein Div und möchte die unterste Position finden. Ich kann die obere Position des Div so finden, aber wie finde ich die untere Position?
var top = $('#bottom').position().top;
return top;
Fügen Sie die äußere Höhe oben hinzu und Sie haben die untere relativ zum übergeordneten Element:
var $el = $('#bottom'); //record the elem so you don't crawl the DOM everytime
var bottom = $el.position().top + $el.outerHeight(true); // passing "true" will also include the top and bottom margin
Bei absolut positionierten Elementen oder bei der Positionierung relativ zum Dokument müssen Sie stattdessen den Versatz verwenden:
var bottom = $el.offset().top + $el.outerHeight(true);
Wie von Trnelson hervorgehoben, funktioniert dies nicht 100% der Zeit. Um diese Methode für positionierte Elemente zu verwenden, müssen Sie auch den Versatz berücksichtigen. Ein Beispiel finden Sie im folgenden Code.
var bottom = $el.position().top + $el.offset().top + $el.outerHeight(true);
var bottom = $('#bottom').position().top+$('#bottom').offset().top+$('#bottom').outerHeight(true)
BEARBEITEN: Diese Lösung ist jetzt auch in der ursprünglichen Antwort.
Die akzeptierte Antwort ist nicht ganz richtig. Sie sollten die Funktion position () nicht verwenden, da sie relativ zum übergeordneten Element ist. Wenn Sie eine globale Positionierung durchführen (in den meisten Fällen?), Sollten Sie nur die versetzte Oberseite mit der äußeren Höhe wie folgt hinzufügen:
var actualBottom = $(selector).offset().top + $(selector).outerHeight(true);
Die Dokumente http://api.jquery.com/offset/
quelle
var bottom = $('#bottom').position().top + $('#bottom').height();
quelle
Die bisherigen Antworten funktionieren. Wenn Sie nur die Höhe ohne Polsterung, Ränder usw. verwenden möchten.
Wenn Sie Auffüllung, Rahmen und Rand berücksichtigen möchten, sollten Sie verwenden
.outerHeight
.var bottom = $('#bottom').position().top + $('#bottom').outerHeight(true);
quelle
Das untere ist das
top
+ dasouterHeight
, nicht dasheight
, da es den Rand oder die Polsterung nicht enthalten würde.var $bot, top, bottom; $bot = $('#bottom'); top = $bot.position().top; bottom = top + $bot.outerHeight(true); //true is necessary to include the margins
quelle
var top = ($('#bottom').position().top) + ($('#bottom').height());
quelle
Dies ist einer der Fälle, in denen jquery es tatsächlich komplizierter macht als das, was das DOM bereits bereitstellt.
let { top, bottom, height, width, //etc } = $('#bottom')[0].getBoundingClientRect(); return top;
quelle
Verwenden Sie dieses Skript, um das Ende von div zu berechnen
$('#bottom').offset().top +$('#bottom').height()
quelle