Magento ver. 2.2.2 on an iOS device, go to a product page that contains an image in the fotorama gallery.
The expected result would be the image for the product in the fotorama gallery box. When I click on the close icon on an iPhone or iPad nothing happens. Hooked the device to my iMac to debug and there are no errors visible in the console.
I fixed this issue with below steps, let’s check it here.
Override gallery.js in your custom theme at app/design///web/fotorama/gallery.js.
You can copy this file from /lib/web/mage/gallery/gallery.js and replace code as mentioned below.
From:
|
1 2 3 4 5 6 7 8 9 10 11 |
if (this.isTouchEnabled) { this.settings.$element.on('tap', '.fotorama__stage__frame', function () { var translate = getTranslate($(this).parents('.fotorama__stage__shaft')); if (translate[1] === '0' && !$(this).hasClass('fotorama-video-container')) { self.openFullScreen(); self.settings.$pageWrapper.hide(); } }); } |
To:
|
1 2 3 4 5 6 7 8 9 10 |
if (this.isTouchEnabled && this.settings.isFullscreen) { this.settings.$element.on('tap', '.fotorama__stage__frame', function () { var translate = getTranslate($(this).parents('.fotorama__stage__shaft')); if (translate[1] === '0' && !$(this).hasClass('fotorama-video-container')) { self.openFullScreen(); self.settings.$pageWrapper.hide(); } }); } |
This problem is based on lib/web/mage/gallery/gallery.js file.