调整窗口大小时,优雅地自动调整Galleria jQuery幻灯片的大小

时间:2012-01-13 05:24:37

标签: javascript jquery slideshow

我正在使用Galleria jQuery幻灯片插件。我可以通过使用$(document).width()和$(document).height()指定宽度和高度来使幻灯片显示填满整个浏览器窗口,一切都按照需要工作。代码如下:

Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
$("#gallery").galleria({
    width: $(document).width(),
    height: $(document).height()
});

我还输入以下代码来处理调整窗口大小的时间:

$(window).resize(function() {
    location.reload();
});

虽然有效,但它会全屏刷新,并不像Galleria的实施那样优雅http://galleria.io/themes/fullscreen/。有没有办法调整幻灯片的大小,而无需使用默认皮肤重新加载整个页面?

2 个答案:

答案 0 :(得分:1)

我没办法测试这个。但是这样的事情可能值得一试。

var gal = $("#gallery").galleria({
    width: $(document).width(),
    height: $(document).height()
});  

$(window).resize(function() {
      gal.width = $(document).width();
      gal.height = $(document).height();
});

答案 1 :(得分:1)

如果我使用扩展功能,我可以将幻灯片设置为全屏,并且在调整窗口大小时它将自动调整大小而不重新加载整页。

$("#gallery").galleria({
    width: $(document).width(),
    height: $(document).height(),
    extend: function() {
    this.enterFullscreen();
    }
});