Архитектура веб-приложения Java EE

CSS FOR TRIGGER : 
.trigger{
  width: 100px;
  height: 2px;
  position: fixed;
  top: 20%;
  left: 0;
  background: red;
  opacity: 0;
  z-index: -1;
}
<script>
$('body').append('<div class="trigger js-trigger"></div>');

        $(document).scroll(function () {


           $('YOUR SECTIONS NAME').each(function () {

               let $this = $(this);

               if($this.offset().top <= $('.js-trigger').offset().top) {

                   if (!$this.hasClass('CLASS NAME FOR CHECK ACTIVE SECTION')) {
                       $this
                           .addClass('currSec')
                           .siblings()
                           .removeClass('currSec');

                   }
               }

           });

        });
</script>