button - 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();
    });
});

这会将关闭的文本放置在左上角，您当然应该使用 som CSS、f.ex 对其进行样式设置：

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