在 div 集中包含 Galleria Gallery 以不显示任何内容

Question

我在 div 中有一个画廊，最初设置为不显示，这是因为我在同一页面上有 5 个这样的画廊，并且只想一次显示一个。现在，每当我单击链接显示其中一个画廊时，我都会收到一个致命错误：

Fatal error: Could not extract a stage height from the CSS. Traced height: 0px.

有没有办法解决这个问题？我的 javascript 知识不是很好，但任何帮助将不胜感激。

谢谢。

乔尼

Answer 1

无论显示画廊容器的事件是什么，您都需要初始化画廊实例。

我也遇到了同样的问题 - 默认情况下，我的画廊在我的页面上是隐藏的（不显示），只有当您单击“查看画廊”链接时才会出现。使用 jQuery SlideDown（它将显示属性设置为阻止），然后我才调用初始化。

$("#gallery-wrapper").galleria({ height: 500, width: 500 });

Answer 2

这个函数

$(".portfolio-links a").click(function() {});

你可以重新调用

$(".gallery").galleria({
    width: 605,
    height: 550,
    autoplay: 3000,
    transition: 'fadeslide'
});

但也许使用唯一的ID，这样你就不会做不必要的工作

Answer 3

我会使用 javascript 在获得高度后隐藏元素。问题是它无法获取 display:none; 元素的高度，它的结构就像幽灵一样，无形。

另外，我认为修复网站可以做的最简单的事情就是向与链接相关的每个链接添加 rel 标记，例如 rel="graphic" 和 rel="packaging " 为每个 div 添加一个类似的标签。

用它来切换不同的画廊。另外，您只针对一个带有 jquery Cycle 插件的画廊，我建议：

$('.portfolio-body').cycle({
    fx: 'scrollLeft',
    speed:   2000, 
    timeout: 3000, 
    next:   '#catalogue-display'
});

这样它就可以针对所有画廊。此外，Galleria 插件似乎至少在 jsFiddle 示例中不起作用。我认为它会与 jQuery Cycle 插件冲突。

我还会更改 onClick 处理程序以使用 rel 来了解要显示哪个图库。并使用类似的东西来隐藏剩余的内容。

$(".portfolio-links a").click(function() {
    $('.portfolio-body').hide();
    var rel = $(this).attr("rel");
    $('.portfolio-body[rel="'+rel+'"').show();
});

我知道我所说的大部分内容与您最初的问题不太相关，但我将从这里开始，它可能会解决您最初的问题。 注意：我没有遇到您上面描述的相同错误