2

Quero saber o espaço entre a parte de baixo da Div A e a parte de baixo do Body. Li sobre o $.offset(), mas este sempre me retorna 0.

PS: Quero apenas em relação ao que aparece na tela. Se o body for maior do que a tela, quero que seja calculado apenas em relação ao que aparece na tela.

PS²: A Div A pode estar em qualquer lugar da tela

inserir a descrição da imagem aqui

1 Resposta 1

3

Se a div estiver posicionada no topo do body o cálculo p/ encontrar essa distância é altura do body menos a altura da div, logo, se a div estiver em outro lugar como na imagem que tu apresentou na pergunta, o cálculo será, a altura do body menos a altura da div mais a distância que ela está do topo do body que pode facilmente ser obtida através do offset().top, o resultado será a distância entre a parte de baixo da div e parte de baixo do body.

*Nota que o valor está quebrado por causa da borda em ambos elementos.

$(document).ready(function() {
  var alturaBody = $("body").height();
  var alturaDiv = $("#divA").height();
  var offsetTop = $("#divA").offset().top;
  console.log("Altura do body: "+alturaBody);
  console.log("Altura da div: "+alturaDiv);
  var espacoEntre = alturaBody - (alturaDiv + offsetTop);
  console.log("Dist. entre div e body: "+espacoEntre);
});
body {
  border: 1px solid red;
  height: 500px;
}

#divA {
  border: 1px solid black;
  height: 100px;
  margin-top: 50px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<div id="divA">
<div>
<body>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .