I'm working on building a infinite scroll feature in an Angular app. Building 1 step at a time, currently I'm at the part where I've attached a scroll eventListener to the #tags-col
or tagsCol
.
plnkr: http://plnkr.co/edit/7OnKAGvVNXWLwN5fZqJu?p=preview
I have code that is suppose to return the top y
value of tagsCol, however the number never updates with the logs as you scroll the element up, it stays stuck at 118.8125
.
How would you get the moving y value of the tagsCol
? Or better yet, detect when the bottom / last element inside of the tagsCol
panel is visible?
function getOffset(el) {
el = el.getBoundingClientRect();
return {
top: el.top + window.scrollY
}
}
var scrollingElement = function(event) {
console.log(tagsCol);
var yPos = getOffset(tagsCol).top
console.log(yPos);
};
document.getElementById('tags-col').addEventListener('scroll', scrollingElement);