How to detect changes on horizontal or vertical scroll?

Question

I have vertical and horizontal scroll. I want to check if user use horizontal scroll to do something or if user vertical to do something.

@HostListener('scroll', ['$event']) onElementScroll($event) {
    let horizontal = $event.currentTarget.scrollLeft;
    let vertical = $event.currentTarget.scrollTop;
    this.h == horizontal ?  this.sticky = true : this.h = horizontal;
    this.v == vertical ?  this.sticky = false : this.v = vertical;
}

This is my code, but i dont know how to know when user use vertical or horizntal scroll. Any suggestion?

Answer 1

You can store the event.scrollTop and event.scrollLeft from the previous event and compare them at the next event to derive if the user scrolled vertically, horizontally, or both.

See also Is there a vertical scroll event in jQuery