Como dice el título, ¿hay alguna función o método simple para calcular la distancia de píxeles entre la parte superior de un div y la parte superior del documento HTML? Todas las preguntas que he visto en stackoverflow lo hacen para la parte superior de div y la parte superior de la ventana gráfica, que es diferente de lo que necesito. Gracias por adelantado.
Aquí hay una función que podría usar, pero no estoy seguro de que funcione en todos los contextos:
function topRelativeToDocumentElement(element) { var curCss, t=0; while (element!==null && element!==document.documentElement) { if ((defaultView=element.ownerDocument.defaultView) && (computedStyle=defaultView.getComputedStyle(element, null))) { curCss=computedStyle.getPropertyValue("position"); } else { curCss=null; } if (curCss!=="static" && curCss!=="fixed") { t+=element.offsetTop; } else if (curCss==="fixed") { t+=element.offsetTop; break; } if (typeof(element.parentNode)!=="undefined") { element=element.parentNode; } else { break; } } return t; }[Editar] Aconsejaría usar esto en su lugar:
var top=elem.getBoundingClientRect().top - document.documentElement.getBoundingClientRect().topLa primera función no tiene en cuenta las transformaciones css, la segunda sí.