'if condition logic pageYoffset >= (element.offsetTop - element.clientHeight / 3)

I am unable to understand the logic pageYoffset >= (element.offsetTop - element.clientHeight / 3) of if statement.
I'm a beginner. I know what is offsetTop, clientHeight, and pageYOffset which I don't understand the maths behind this? PLease Help.

Here is my code:

const sections document.querySelectorAll('section');
const navLi = document.querySelectorAll('nav .container u1
li');
window.addEventlistener ('scroll', ()=> {
  let current = '';
  sections.forEach( section => {
    const sectionTop = section.offsetTop;
    const sectionHeight = section.clientHeight;
    if(pageYOffset >= (sectionTop - sectionHeight / 3)){
      current = section.getAttribute('id');
  })
  navLi.forEach( li => {
    li.classList.remove('active');
    if(li.classList.contains(current)){
      li.classList.add('active')
  })
})



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source