在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}