driver458

Вот что у меня получилось:

updateActivePage = () => {
  const blockElements = document.getElementsByClassName("block");
  let activeIndex;

  Array.prototype.forEach.call(blockElements, (element, index) => {
    const rect = element.getBoundingClientRect();

    if (rect.top + rect.bottom > 0) {
      if (activeIndex === undefined) activeIndex = index;
    }
  });
  this.setState({ activeIndex });
};

алгоритм может быть улучшен, но меня на данный момент устраивает
Весь код + лайв пример

Моё решение под React
Источник

componentDidMount() {
  window.addEventListener('scroll', this.handleScroll);
}

componentWillUnmount() {
  window.removeEventListener('scroll', this.handleScroll);
}

handleScroll = (e) => {
  if (window.innerHeight + window.scrollY > document.body.clientHeight - 100) {
    console.log('I need to load some more content here…');
  }
}