How to disable the animation of SXA image gallery in mobile

Question

I have added the Sitecore sxa image gallery. My requirement is to hide the pop up which comes in the mobile view on double-tap of image. I have tried with event.preventdefault ,.stop(),event.stoppropagation etc on galleria-images class in Jquery inside set timeout method.However no success. When I add an alert in Jquery the pop up is not coming anymore. But I need to achieve this without any alert. Is there a way in CSS/Jquery/disabling the animation?

Answer 1

To disable the above animation follow the below steps. Gallery rendering in SXA uses the Galleria JS library. Galleria component is initialized in the /sitecore/media library/Base Themes/Components Theme/Scripts/component-galleria script. You can edit this script to disable the full screen view on mobile devices:

api.initInstance = function(component, prop) {
  var id = component.find(".gallery-inner").attr("id");
  prop.fullscreenDoubleTap = false;
  Galleria.loadTheme(prop.theme);
  Galleria.run("#" + id, prop);
};

Hope it helps!!