Technique to prevent navigating back/forward in browser, or revealing Mac widgets panel, when swiping left/right to horizontally scroll?

Question

When I swipe left or right with 2 fingers to scroll an HTML element left or right (on my Macbook Pro), like in this Google Ads Keyword Planner UI, more often than not (like 70-80% of the time), it either:

1. Invokes and shows the Mac widgets panel on the right, if I swipe left (i.e. "pulling" it out from the right).
2. Navigates back to the previous URL (if I try to scroll left), or navigates forward (if I try to swipe right).

It is really annoying, and I would like to prevent this behavior at the browser level ideally, so users of the website don't have to, for example, turn off the Mac widgets panel from ever opening on scroll left. I would like to figure out what measures I can take in the browser to prevent this behavior from ruining the functionality of horizontal scroll.

My use case for horizontal scroll is a piano or guitar fretboard, stretching from left to right. It needs to be horizontal because I might show multiple fretboards stacked. Then you can see like 12 frets at a time (or less on mobile perhaps), and scroll left or right to see the 20+ total frets. It should be as easy as "swipe with 2 fingers left or right" to scroll, but this thing with the navigation back/forward or the widgets panel constantly popping up is really annoying and getting in the way.

The problem with disabling the widgets panel or navigation left/right, is that users may be used to that feature and rely on it for everything else (I in particular don't, but who knows). So I think that only when you hover over the piano/fretboard should that "native feature" be disabled on scroll left/right. And if you get to the end of scrolling, it doesn't ever trigger navigation or widgets panel popup.

1. Navigation disabling seems possible so long as the scroll event is blocked within the browser.
2. Is it possible to disable the widgets panel popup in particular? I am not sure I can block it from hitting the desktop functionality.

And after that, my question is, what events should I be watching and handling (in JavaScript), to make this happen in particular?