Прокрутить список div

У меня есть вертикально прокручиваемый div, в котором n изображений сопоставляются с кнопками обратной связи (полезно) или (бесполезно).

Нравиться

<div className="scrollable__div" id="scrollable__div">
        {sliderImages.map((sliderImg) => (
          <>
            <img src={sliderImg} alt="" />
            <div className="btnsSection">
              <Button
                onClick={SliderYesClicked}
                className="greenBtn"
                id="section2__yesBtn"
              >
                Yes
              </Button>
              <Button
                onClick={SliderNoClicked}
                className="redBtn"
                id="section2__noBtn"
              >
                No
              </Button>
            </div>
          </>
        ))}
      </div>

Я хочу, чтобы конкретная функция вызывалась, когда этот div прокручивался на определенное расстояние. пример

element.addEventListener('scroll', callback)

Это работает, но мне нужно количественное прослушивание прокрутки. Например, когда горизонтальная прокрутка div больше x, вызовите это.

Возможно как

    if (scrollableDiv.scrollY >= 100){
   console.log(''Scrolled 100px)
}

Это возможно?