Javascript 快速反应画廊

Javascript 快速反应画廊,javascript,jquery,galleria,Javascript,Jquery,Galleria,我正试图在其响应模式下使用这个插件,这基本上意味着它将在窗口重新调整大小时根据其容器大小重新绘制自己。我提供的链接上的演示展示了一个非常好的示例。您可以看到,当您调整窗口大小时,整个图库都会相应地进行调整。现在我的问题是,插件不允许我初始化库,除非为用作其容器的DOM元素指定了高度。这意味着,我不得不编写大量javascript代码来响应窗口的大小调整——这相当程度上破坏了响应模式的作用——但在上面的网站中,我找不到明确的指定高度。有人能告诉我哪里出了问题吗?我自己想出来的。张贴我的答案- 初始

我正试图在其响应模式下使用这个插件,这基本上意味着它将在窗口重新调整大小时根据其容器大小重新绘制自己。我提供的链接上的演示展示了一个非常好的示例。您可以看到,当您调整窗口大小时,整个图库都会相应地进行调整。现在我的问题是,插件不允许我初始化库,除非为用作其容器的DOM元素指定了高度。这意味着,我不得不编写大量javascript代码来响应窗口的大小调整——这相当程度上破坏了响应模式的作用——但在上面的网站中,我找不到明确的指定高度。有人能告诉我哪里出了问题吗?

我自己想出来的。张贴我的答案-

初始化画廊时,请指定您的身高百分比,如下所示。我猜在这种情况下,它需要50%的窗户高度作为它的值。这样,您不需要在任何地方显式指定高度,它可以按照广告的方式工作

Galleria.run('#gallery', {responsive:true, height:0.5, debug:false});
高度选项(如果小于2.0)与容器的宽度相关。因此
height:0.5
的高度是容器宽度的一半(w=2,h=1)

高度:1.5将导致(w=2,h=3)

为保持响应性,在设置容器样式时,可以使用
max width
而不是
width


如果“高度”选项设置为2.0或更高,则会将其解释为像素。因此
高度:2.0
仅为2倍高。

凯丹需要一个高度来正确初始化。您可以通过CSS或JS实现这一点

如果您想让它填充屏幕的宽度和高度,我建议通过CSS将宽度和高度设置为100%其父容器需要为100%。见下文

**JS:**
Galleria.run('#galleria', {
  responsive:true,
  showCounter:true,
  thumbnails:false,
  trueFullscreen:true,
});

**CSS:**
#galleria{
  width:100%;
  height: 100%;
  position: fixed;
  z-index: 9999;
  top:0px;
  bottom: 0px;
}
body,html{
   height:100%;
   width:100%;
}

我也有同样的问题。如果我提供一个高度,它将不会响应。如果我不提供高度,它会崩溃,告诉我它无法从CSS读取高度。示例中的开发人员正在通过javascript动态添加所有html。如果查看Page Source,您将看到gallery div实际上是空的,然后调用一个G.init()函数,完成所有工作。有人能提供一个解决方案吗?@Dogoku-为了您的利益,我添加了一个答案-如果您觉得它有用,请告诉我尝试这个解决方案,我确实找到了答案,但是它的行为并不完全符合我的要求,所以我认为我做错了什么。哦,我们中至少有一个人是快乐的,正如你所说的,它对应于你希望遵循的纵横比。查阅