调整galleria的脚本

我想调整整个galleria div的大小，并调整使用galleria脚本动态生成的所有图像。

到目前为止我有

$(window).resize(function() { var h = $(window).height(); var galleriaHeight = h-54; var w = $(".content").width(); var galleriaWidth = w-18; $("#galleria").height(galleriaHeight); $("#galleria").width(w); $(".galleria-stage").height(galleriaHeight); $(".galleria-stage").width(galleriaWidth); $(".galleria-images .galleria-image img").css({"max-height":"auto"}); $(".galleria-images .galleria-image img").css({"max-width":galleriaWidth-36}); $(".galleria-stage").height(galleriaHeight); $(".galleria-stage").width(galleriaWidth); $(".galleria-container").width(w); $(".galleria-container").height(galleriaHeight); $(".caption").width(w); $(".counter-nav").width(w); var sidebarHeight =h-54; var contentHeight =h-36; $(".sidebar1").height(sidebarHeight); $(".content").height(contentHeight); }); 

但是一切都在不均衡地扩展并且非常混乱。 看了全屏代码后，我还补充道

 this.bind(Galleria.RESCALE, function() { POS = this.getStageHeight() - tab.height() - 2; thumbs.css('top', OPEN ? POS - list.outerHeight() + 2 : POS); var img = this.getActiveImage(); if (img) { fixCaption(img); } }); 

但那也不起作用……

我想我想在重新resize之后重新加载页面…或者相对于彼此调整所有元素的大小，或者使用Galleriaresize脚本……

有任何想法吗？

Answer 1

我知道这是旧的，但我在任何地方都没有看到答案。 希望它可以帮助下一个人。

这将在调整浏览器窗口大小时动态调整Galleria的大小。

我遇到了类似的问题。 我最终将以下函数绑定到window resize事件。 我在这篇文章中使用了resize事件的逻辑

首先，设置resizefunction：

  function ResizeGallery() { gWidth = $(window).width(); gHeight = $(window).height(); gWidth = gWidth - ((gWidth > 200) ? 100 : 0); gHeight = gHeight - ((gHeight > 100) ? 50 : 0); $("#gallerycontainer").width(gWidth); $("#gallery").width(gWidth); $("#gallery").height(gHeight); Galleria.loadTheme('js/galleria/themes/classic/galleria.classic.js', { show: curIdx }); } 

然后将其绑定到窗口resize事件：

  var TO = false; $(window).resize(function () { if (TO !== false) clearTimeout(TO); TO = setTimeout(ResizeGallery, 200); //200 is time in miliseconds }); 

这将基本上通过重新加载默认主题来重新初始化。 在这个例子中，我使用第二个参数来指定要显示的图像 – 否则它将显示第一个图像。 请注意，这可能会导致另一个Galleria实例。 我相信这是一个错误，并发布在他们的论坛上 。 您可以按如下方式删除旧实例：

  var gcount = Galleria.get().length; if (gcount > 1) { Galleria.get().splice(0, gcount - 1); } 

在loadTheme方法之后运行它。 使用settimeout来延迟它，因为loadTheme需要一些时间才能完成。 我用200ms。 丑陋，但我需要Galleria的一些function。 希望这可以帮助。