jquery div scroll and stop in position

I am struggling for 2 days regarding this issue. I have a div that needs to scroll down from one section to another section and then snap into position while letting the user keep scrolling down. I have created a js code swapping fixed position to an absolute position under a position of the scrollbar height. My teacher didnt like it and said not to swap css classes. so I have the following code. But I dont really know where to go from here. I need to hijack the scrolling and make my div work.

attachScrollEvents: function() {
    var self = this;
    $(window).on('scroll', _.throttle(self.updatePosition, 100) );
  }, 

updatePosition: function() {
    var self = this;
    console.log('scrolling');
    $(window).on('scroll', function(){
      var scroll = $(window).scrollTop();
      var sectionPosTop = document.getElementById('header-bamboo-scroll').getBoundingClientRect();
      var headerHeight = document.getElementById('header').getBoundingClientRect();

      if (scroll >= 665 && scroll <= 675 ) {
        console.log('greater than 660 and less than 680');
        $('html, body').animate({
          scrollTop: headerHeight.height
        }, 500, function() {
          // $('html, body').stop();
        });
      }
    });
  } // end of update position