Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

171
Views
jQuery get the children distance from parent div

I have this HTML:

console.log( $(".sh-sidebar-content").height() );
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="sh-sidebar-content">
  <ul>
    <li><a href="#one">Compară ofertele noastre pentru a găsi cel mai bun credit ipotecar sau Prima Casă</a></li>
    <li><a href="#two">Ce este un credit ipotecar</a></li>
    <li><a href="#three">Care sunt condițiile de acordare ale unui credit ipotecar pentru cumpărarea sau construirea unei locuințe</a></li>
    <li><a href="#four">Care este suma maximă pe care o pot împrumuta</a></li>
    <li><a href="#five">Ce este creditul Noua Casă (fost Prima Casă)</a></li>
    <li><a href="#six">Care sunt condițiile de acordare ale unui credit prin Noua Casă</a></li>
    <li><a href="#seven">Care este suma maximă pe care o pot împrumuta prin Noua Casă</a></li>
    <li><a href="#eight">Acte necesare pentru solicitarea unui credit ipotecar</a></li>
    <li><a href="#nine">Acte necesare pentru solicitarea unui credit Noua Casă</a></li>
    <li><a href="#ten">Care este procedura de acordare pentru un credit ipotecar?</a></li>
    <li><a href="#eleven">Care este procedura de acordare a unui credit Noua Casă?</a></li>
    <li><a href="#twelve">Cum se restituie un credit ipotecar</a></li>
    <li><a href="#thirteen">Cum se restituie un credit obținut prin programul Noua Casă</a></li>
  </ul>
</div>

Based on this class sh-sidebar-content I need to get the distance of each li element.

I can get the height of sh-sidebar-content class using

$(".sh-sidebar-content").height()

It shows me the height value based on the window height. For eg: 735.

So, Now, I need to get the distance from this value of the li element.

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

You can use position for this. Get the base point (div) position, then get each li's position, then subtract.

let divPos = $(".sh-sidebar-content").position();

$(".sh-sidebar-content li").each(function(i)
{
  console.log( $(this).position().top - divPos.top );
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="sh-sidebar-content">
  <ul>
    <li><a href="#one">Compară ofertele noastre pentru a găsi cel mai bun credit ipotecar sau Prima Casă</a></li>
    <li><a href="#two">Ce este un credit ipotecar</a></li>
    <li><a href="#three">Care sunt condițiile de acordare ale unui credit ipotecar pentru cumpărarea sau construirea unei locuințe</a></li>
    <li><a href="#four">Care este suma maximă pe care o pot împrumuta</a></li>
    <li><a href="#five">Ce este creditul Noua Casă (fost Prima Casă)</a></li>
    <li><a href="#six">Care sunt condițiile de acordare ale unui credit prin Noua Casă</a></li>
    <li><a href="#seven">Care este suma maximă pe care o pot împrumuta prin Noua Casă</a></li>
    <li><a href="#eight">Acte necesare pentru solicitarea unui credit ipotecar</a></li>
    <li><a href="#nine">Acte necesare pentru solicitarea unui credit Noua Casă</a></li>
    <li><a href="#ten">Care este procedura de acordare pentru un credit ipotecar?</a></li>
    <li><a href="#eleven">Care este procedura de acordare a unui credit Noua Casă?</a></li>
    <li><a href="#twelve">Cum se restituie un credit ipotecar</a></li>
    <li><a href="#thirteen">Cum se restituie un credit obținut prin programul Noua Casă</a></li>
  </ul>
</div>

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!