javascript - insertar - jQuery Obtiene el desplazamiento superior relativo a un div específico
parent jquery (1)
Con jQuery, ¿cómo encontraría la posición de desplazamiento con respecto a un contenedor específico?
Por ejemplo, tienes esto:
<body style="padding:20px">
<div id="top-container" style="margin-top:20px">
<div id="one-level-container" style="margin-top:70px">
<div id="two-level-container" style="margin-top:120px">
<div id="ELEMENT" style="margin-top:10px">
</div>
</div>
</div>
</div>
</body>
(El relleno y los márgenes superiores son solo ejemplos).
¿Cómo verificaría la posición superior de #ELEMENT a # top-container?
He intentado usar la compensación y la posición de jQuery, pero no parecen obtener la compensación correcta que estoy buscando.
Use $.offset()
, por ejemplo
alert($("#ELEMENT").offset().top - $("#top-container").offset().top)
body {
background: blue
}
div {
padding: 20px
}
#top-container {
background: green
}
#one-level-container {
background: red
}
#two-level-container {
background: black
}
#ELEMENT {
background: orange
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<body style="padding:20px">
<div id="top-container" style="margin-top:20px">
<div id="one-level-container" style="margin-top:70px">
<div id="two-level-container" style="margin-top:120px">
<div id="ELEMENT" style="margin-top:10px">
</div>
</div>
</div>
</div>
</body>