Mapbox issues: Unexpected scroll to top or bottom & centering within Mapbox Frame

Design help Custom code
1

Hi there,

I’m implementing Mapbox onto a Contact Page. I’ve used Custom Code (quite messily) to do the following:
When a user clicks on a Location on the right, then it will trigger Mapbox to fly to the location I selected. The popup will then appear.

However,

  1. at random times, clicking the button resorts in randomly scrolling to the top or bottom of the page. I don’t want this to happen.
  2. Clicking on a location doesn’t actually center it in the Mapbox frame.

It might be because of the custom code I wrote.

Would anyone be able to spot out what the issue is?

Here is my site Read-Only

Here’s my site’s staging link

Here’s the error as a Loom video