2

我决定为我的投资组合网站使用 Galleria jquery 插件。我想要实现它的方式是加载经典主题。另外,我在左上角用一个按钮扩展了经典主题,当按下浏览器进入全屏模式并且 Galleria 切换到全屏主题时。在全屏主题中存在相同的按钮,但是当再次按下它时,它会从全屏模式切换回正常模式,并返回到显示我网站其余部分的经典主题。

我似乎找不到令人满意的解决方案。到目前为止,我所拥有的让我进入全屏模式并完美地更改主题,但是当我再次按下按钮时,它会返回页面并切换到具有致命错误阶段高度的经典模式。我试图将配置选项放在很多地方,但我似乎没有在 loadtheme 之后运行。

这是我到目前为止坚持的代码:

    var OptionsFullscreen = {
    height: 1, //0.5625 16:9, 0.74 4:3 format
    imageCrop: false,
    idleSpeed: 100,
    idleTime: 1000,
    clicknext: true,
    transition: 'fade'
    };

var OptionsNormal = {
    height: 0.5625, //0.5625 16:9, 0.74 4:3 format
    imageCrop: false,
    idleSpeed: 100,
    idleTime: 1000,
    clicknext: true,
    transition: 'fade'
    };



Galleria.loadTheme('js/themes/classic/galleria.classic.min.js');
Galleria.configure(OptionsNormal);

Galleria.run('#gallery', {
    extend: function() {

    var gallery = this;

    // Add button for toggling fullscreen theme
    this.addElement('fscr');
    this.appendChild('stage','fscr');

    var fscr = this.$('fscr')
    .text('Fullscreen')
    .click(function(e) {

    e.preventDefault;

    gallery.toggleFullscreen();

    });

    this.addIdleState(this.get('fscr'), { opacity:0 });
    }
});



Galleria.ready(function() {



this.bind('fullscreen_enter', function() {
Galleria.loadTheme('js/themes/fullscreen/galleria.fullscreen.min.js');
});


this.bind('fullscreen_exit', function() {
Galleria.loadTheme('js/themes/classic/galleria.classic.min.js');
Galleria.configure(OptionsNormal);
});

});
4

0 回答 0