Выделение активного якоря с половины высоты экрана

var $sections = $('section'); 
var section_position = {}; //тут храним все верхние точки наших section 
var screen_height = $(window).height(); //высота видимой страницы 
 
checkPosition(); 
 
$(window).resize(function(){ 
  checkPosition(); 
}); 
 
function checkPosition(){ 
  screen_height = $(window).height(); 
 
  $sections.each(function(i, el) { 
    section_position[i] = $(el).offset().top - 0; 
  }); 
} 
 
function toggleActiveClass(id) { 
  $('a.active').removeClass('active'); 
  $('a[href="#' + id + '"]').addClass('active'); 
} 
 
$(window).scroll(function() { 
  var s_top = $(document).scrollTop() + screen_height / 2; 
 
  for (key in section_position) { 
 
    if (s_top >= section_position[key] || s_top <= section_position[key + 1]) { 
      var id = $($sections[key]).attr('id'); 
      toggleActiveClass(id); 
    } 
 
  }; 
 
}); 
 
$("nav").on("click", "a", function(event) { 
  event.preventDefault(); 
  id = $(this).attr('href'); 
  var top = $(id).offset().top; 
  $('body,html').animate({ 
    scrollTop: top 
  }, 800); 
});

ul, 
li { 
  list-style-type: none; 
  margin: 0; 
  padding: 0; 
} 
 
a { 
  text-decoration: none; 
  display: block; 
  padding: 20px 5px 5px 20px; 
} 
 
.menu { 
  position: fixed; 
  top: 0; 
  left: 0; 
} 
 
.section { 
  width: 100%; 
  height: 100vh; 
  padding: 0 0 0 50px; 
} 
 
.active { 
  color: white; 
  background: red; 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<nav> 
  <ul id="menu" class="menu"> 
    <li><a href="#sec1" class="scroll-to">1</a></li> 
    <li><a href="#sec2" class="scroll-to">2</a></li> 
    <li><a href="#sec3" class="scroll-to">3</a></li> 
    <li><a href="#sec4" class="scroll-to">4</a></li> 
    <li><a href="#sec5" class="scroll-to">5</a></li> 
  </ul> 
</nav> 
<section id="sec1" class="section">Секция 1</section> 
<section id="sec2" class="section">Секция 2</section> 
<section id="sec3" class="section">Секция 3</section> 
<section id="sec4" class="section">Секция 4</section> 
<section id="sec5" class="section">Секция 5</section>