Как нажать на функцию, когда позиция прокрутки достигает верхней позиции?

Question

Когда позиция прокрутки достигает верхней позиции документа, вызывается функция. Как это сделать?

Answer 1

Вы можете использовать HostListener для прослушивания события прокрутки

@HostListener("window:scroll", ["$event"])
onWindowScroll() {
 // get scroll postion 
  let number = this.window.pageYOffset || 
  this.document.documentElement.scrollTop || this.document.body.scrollTop || 
  0;

 // here you can check the scroll postion
  if (number > 100) {

  } 
}

Answer 2

Используйте addEventListener для тела и прослушивайте событие 'scroll', затем при возникновении события проверьте свойство scrollY окна, и если оно равно 0, то вы находитесь на вершине.

function yourFunction() {
  console.log('you are on top');
}

window.addEventListener('scroll', () => {
  if (window.scrollY == 0) yourFunction();
}, true);

Answer 3

Хороший способ сделать это - использовать HostListener

@HostListener("window:scroll", [])
onWindowScroll() {
    let scroll = this.window.pageYOffset || this.document.documentElement.scrollTop || this.document.body.scrollTop || 0;
    if (number = 0) {
      // Do some stuff here
    }
}

Теперь я просто хочу добавить, что вам, вероятно, нужно учитывать упругую прокрутку на рабочих столах Mac. Это означает, что ваша позиция прокрутки может идти в минус и может не достигать 0 точно, когда вы хотите, чтобы это событие сработало.

Вот хорошее сообщение в блоге об этом, если вы хотите больше материалов для чтения