My answer concerning to your other question but also to webp format:
https://kriesi.at/support/topic/add-lightbox-manually/#post-1355589

Just use webp – the “can i use page” shows that only the IE11 with less than 0,5% gloabal usage does not support webp.
In my opinion the usage of a fallback solution is now obsolete. Enfold supports webp usage in all alb elements – no need for a picture construct.

See slider on : https://enfold.webers-webdesign.de/tooltips/

on your page you use that ( by the way deprecated window.load is involved too ) script:

jQuery(window).load(function(){
	jQuery('a').removeAttr('title');
	jQuery('img').removeAttr('title');
});

without the titles – the lightbox got no info what to show!
The question now is when you inserted the script, because even in the earlier version of enfold this could not work.

Have a look into the alb you set – maybe there is the option not to use the title but f.e. description.
Or just not to remove the title – but save it to another attribut and save back on click or on mouseout:

can you try this instead :

function temporary_removal_title_tags(){
?>
<script>
  window.onload = function() {
      var links = document.querySelectorAll('a, img');
      for (var i = 0; i < links.length; i++) {
          var link = links[i];
          link.onmouseover = function() {
              this.setAttribute("data-tooltip", this.title);
              this.title = "";
          };
          link.onmouseout = function() {
              this.title = this.getAttribute("data-tooltip");
          };
          link.onmousedown = function() {
              this.title = this.getAttribute("data-tooltip");
          };
      }
  };
</script>
<?php
}
add_action('wp_footer', 'temporary_removal_title_tags');

btw: maybe you decide to darken the lightbox background a bit more – because the png files with the transparency will then be better seen:

.mfp-zoom-in.mfp-ready.mfp-bg, 
.mfp-zoom-in.mfp-ready .mfp-preloader {
  opacity: 0.9 !important;
}

can you use instead:

function temporary_removal_title_tags(){
?>
<script>
  window.onload = function() {
      var links = document.querySelectorAll('a, img, *[title]');
      for (var i = 0; i < links.length; i++) {
          var link = links[i];
          link.onmouseover = function() {
              this.setAttribute("data-tooltip", this.title);
              this.title = "";
          };
          link.onmouseout = function() {
              this.title = this.getAttribute("data-tooltip");
          };
          link.onmousedown = function() {
              this.title = this.getAttribute("data-tooltip");
          };
      }
  };
</script>
<?php
}
add_action('wp_footer', 'temporary_removal_title_tags');

if these are only images that are not meant to be opend in a lightbox – you can simply remove the titles of the images.
This is not an enfold setting – it is simple browser behavior to show after a while the title on hovering.
just put it in the child-theme functions.php:

function remove_title_attr(){
?>
<script>
(function($) {
  $(window).on('load', function(){
    $('*[title]').removeAttr('title');
  });
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'remove_title_attr');

__________

If you need the title for lightbox bottom-bar description – use instead:

function temporary_removal_title_tags(){
?>
<script>
  window.onload = function() {
      var links = document.querySelectorAll('a,img,div[title]');
      for (var i = 0; i < links.length; i++) {
          var link = links[i];
          link.onmouseover = function() {
              this.setAttribute("data-tooltip", this.title);
              this.title = "";
          };
          link.onmouseout = function() {
              this.title = this.getAttribute("data-tooltip");
          };
          link.onmousedown = function() {
              this.title = this.getAttribute("data-tooltip");
          };
      }
  };
</script>
<?php
}
add_action('wp_footer', 'temporary_removal_title_tags');

i am not sure if the magnificPopup script supports webp. Unfortunately the developer is not well reachable at the moment; Dmitry Semenov is a Ukrainian developer. The documentation does not say if and if yes how to set it.
Edit: it does support webp – see webp and jpg : https://enfold.webers-webdesign.de/tooltips/
But: Enfold supports webp and most modern browser as well : Can I Use
For all those IE 11 ( and earlier ) users ?

As said above – i had to see the concerning DOM to give exact advice.
i actually found the takeover of the tags quite nice. So you have even more design options.
i don’t know why my code is not working on your test page, because the structure has not been changed to Enfold5.
The difference is – that i use the magnificPopup api to give the popup title a different source.

Maybe it is because i set the titleSrc to false and have my own markup ( to avoid lightbox counter )

function popup_tooltips_with_links() { 
?>
<script type="text/javascript">
(function($){
$(window).on('load', function(){
    $('.av-image-hotspot_inner').magnificPopup({ 
      type: 'image',
      mainClass: 'avia-popup',
      closeOnContentClick:  false,
      midClick: true,
      gallery: {
      enabled: true
      },
      image: {
        titleSrc: false,
        markup: '<div class="mfp-figure">'+
                    '<div class="mfp-close"></div>'+
                    '<div class="mfp-img"></div>'+
                    '<div class="mfp-bottom-bar">'+
                      '<div class="mfp-title"></div>'+
                    '</div>'+
                  '</div>',
      },
      callbacks: {
        markupParse: function (template, values, item) {
          values.title = item.el.closest('.av-image-hotspot').attr('data-avia-tooltip');
        },
      },
  }); 

  $(document).on('click', '.popup-modal-dismiss', function (e) { 
    $.magnificPopup.close();
  });
});
})(jQuery);
</script>
<?php }
add_action('wp_footer', 'popup_tooltips_with_links');

i had to see the page it belongs. When seeing numbers on recurring elements i tend to use an index in each function.
But it is hard to give advice without the concrete page – so maybe Ueli send me an email if he does not like to make the link public.

Is it similiar to that demo page: https://kriesi.at/themes/enfold-restaurant/reservations/ but with links on the tooltips ?

try something like this:

function popup_tooltips_with_links() { 
?>
<script type="text/javascript">
(function($){
$(window).on('load', function(){
    $('.av-image-hotspot_inner').magnificPopup({ 
    type:               'image',
    mainClass:          'avia-popup',
    closeOnContentClick:  false,
    midClick:         true,
    gallery: {
      enabled:      true
    },
    callbacks: {
      markupParse: function (template, values, item) {
        values.title = item.el.closest('.av-image-hotspot').attr('data-avia-tooltip');
      },
    },
  }); 

  $(document).on('click', '.popup-modal-dismiss', function (e) { 
    $.magnificPopup.close();
  });
});
})(jQuery);
</script>
<?php }
add_action('wp_footer', 'popup_tooltips_with_links');

See: https://enfold.webers-webdesign.de/tooltips/
( i did not want on that lightbox a counter – so i got my own markup here )

If you do not like to show the tooltip:

.avia-tooltip.av-tt-hotspot {
  display: none !important;
}

the setting on default is:

.avia-tooltip .inner_tooltip {
  font-size: 0.925em;
  line-height: 1.65em;
}