Кнопка закрытия в полноэкранном режиме в Galleria

Question

Если вы использовали полноэкранный режим в экземпляре Galleria, вы видели, что единственный способ закрыть его - нажать клавишу выхода.

Поскольку мне нравится эта функциональность, поскольку она действительно практична, для конечных пользователей она не настолько интуитивна, поэтому я хотел бы добавить кнопку закрытия в правом верхнем углу.

Я проверил код, чтобы узнать, куда добавить эту кнопку, но я не мог понять, как она работает.

Кто-то уже сделал это? Я надеюсь, что я не единственный, кто имел эту идею.

Спасибо за вашу помощь!

Answer 1

Вы добавляете его с помощью Galleria API:

Galleria.ready(function() {
    var gallery = this;
    this.addElement('exit').appendChild('container','exit');
    var btn = this.$('exit').hide().text('close').click(function(e) {
        gallery.exitFullscreen();
    });
    this.bind('fullscreen_enter', function() {
        btn.show();
    });
    this.bind('fullscreen_exit', function() {
        btn.hide();
    });
});

Это поместит закрывающий текст в верхний левый угол, вы, конечно, должны стилизовать его с помощью CSS, например:

.galleria-exit{position:absolute;top:12px;right:12px;z-index:10;cursor:pointer}