javascript - tamaño - jquery height

cómo encontrar la distancia vertical desde arriba en px de un elemento usando jQuery

Question

¿Cómo encuentro la distancia vertical desde la parte superior de la página hasta donde el elemento existe en el DOM usando javascript / jQuery?

Tengo algo como

<ul>
    <li>one</li>
    <li>one</li>
    <li>one</li>
    <li>one</li>
    <li class="test">one</li>
    ....
    ....
    ....
    <li>one</li>
</ul>

Por ejemplo, aquí, quiero encontrar la distancia vertical desde la parte superior de la página hasta el elemento de li#test .

Intenté .scrollTop() pero siempre viene como 0!

Answer 1

Hasta donde yo sé .offset() obtiene la distancia entre la posición de desplazamiento actual y la parte superior del documento.

$("li.test").position().top usar esto: $("li.test").position().top

Answer 2

La respuesta de Rob W es correcta, eso le dará la compensación desde la parte superior de la página completa.

Si desea obtener el desplazamiento desde la parte superior de la pantalla visible, debe hacer esto:

var viewableOffset = $("#li.test").offset().top - $(window).scrollTop();

¡Espero que ayude!

Answer 3

Use $ (element) .offset (). Top y agregue la altura de los elementos fijos existentes en la página para que sea más preciso.

Answer 4

Use .offset() para obtener la distancia entre un elemento y la parte superior del documento:

$("li.test").offset().top