How to detect when the user scrolls to the bottom of the site?


What forms could I detect in my component when the user scrolls and reaches the end of the site and thus call a function when this happens?

asked by Santiago D'Antuoni 23.02.2017 в 19:19

2 answers


You can use the affix function of js to generate effects when you move the scroll. I give you an example with Bootstrap that emulates what you are looking for, in the example basically the color blocks would be the bootom of your page, it depends what function or style triggers.

offset: {
top: 100, //estilos
bottom: function () {
  return (this.bottom = $('.footer').outerHeight(true)) //eventos

} })


answered by 23.02.2017 в 19:52

I leave my solution, and most importantly. Without bootstrap, in case someone needs it.

let container = document.getElementById('body');

container.onscroll = function () {
  let height = this.clientHeight;
  let scrollHeight = this.scrollHeight;
  let scrollTop = this.scrollTop;
  if (height + scrollTop === scrollHeight) {

answered by 23.02.2017 в 22:11