1

Magento 2: How to set first image of product slider after cancel or exit fullscreen popup of image slider.

By default its display current selected image after exit popup in detail page. I have to display first image of slider which is default image after page load.

Any help would be appericiated.

1

You can do this by extending the mage/gallery/gallery js module and then calling your JS in the template rather than the core gallery.js file.

Selecting the first element after closing an image can be done like so:

define([
    'jquery',
    'mage/gallery/gallery'
], function ($, Gallery) {
    'use strict';

    return Gallery.extend({

        initFullscreenSettings: function () {
            var settings = this.settings,
                self = this;

            this._super();

            settings.$gallery.on('fotorama:fullscreenexit', function () {
                settings.closeIcon.hide();
                settings.focusableStart.attr('tabindex', '-1');
                settings.focusableEnd.attr('tabindex', '-1');
                settings.api.updateOptions(settings.defaultConfig.options, true);
                settings.focusableStart.unbind('focusin', this._focusSwitcher);
                settings.focusableEnd.unbind('focusin', this._focusSwitcher);
                settings.closeIcon.hide();

                if (!_.isEqual(settings.activeBreakpoint, {}) && settings.breakpoints) {
                    settings.api.updateOptions(settings.activeBreakpoint.options, true);
                }
                settings.isFullscreen = false;
                settings.$element.data('gallery').updateOptions({
                    swipe: true
                });

                self.settings.api.first();
            });
        }
    });
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.