Is it possible to add a hover for the pin popups without needing to create this code from scratch? At the moment I can click the markers and the popup displays.

Is there a way to add a mousenter for the popups to my existing code?

if($('#map').length) {
    const geoLocation = $('.graphic_map').data('json');
    const mapCenterPos = $('.graphic_map').data('center-pos');
    const mapZoom = $('.graphic_map').data('zoom');

    mapboxgl.accessToken = 'token goes here';

    var map = new mapboxgl.Map({
        container: 'map', 
        style: 'mapbox://styles/mapbox/light-v10', 
        center: mapCenterPos,
        zoom: mapZoom ? mapZoom : 14 
    });

    map.addControl(new mapboxgl.NavigationControl());

    geoLocation.features.forEach(function (marker) {
        var el = document.createElement('div');
        el.className = `marker ${marker.status}`;

            new mapboxgl.Marker(el)
            .setLngLat(marker.geometry.coordinates)
            .setPopup(new mapboxgl.Popup({ offset: [130, -15] }).setHTML(
                ` 
                <div class="tooltip">
                    <div class="tooltip__thumbnail" style="background-image:url('${marker.properties.image}')"></div>
                    <div class="tooltip__text">                    
                        <p>${marker.properties.title.replace('~',"'")}</p>
                        <div>${marker.properties.description}</div>
                        <a class="tooltip__view" href="${marker.properties.link}">View</a>
                    </div>
                </div>
                `
                
            )
            )
            .addTo(map);


        const legendCheckbox = $('.graphic_map__legends').find(`[name=${marker.status}]`);
        $(legendCheckbox).parent().click(function() {
            $('.graphic_map__legend').removeClass('active');
            $(this).addClass('active');
            $('.graphic_map__legend input').prop('checked', false);
            $(this).children('input').prop('checked', true);
            if(marker.status == 'all') {
                $('.graphic_map__map .marker').show();
            } else {
                $('.graphic_map__map .marker:not(.all)').hide();
                $(`.graphic_map__map .marker.${marker.status}`).show();

            }
        });
    });
}