jquery - 是否可以在 div 中放置灯箱？

Question

是否可以在 div 内打开灯箱而不是覆盖整个屏幕？

说我的代码是：

<div>
 <a href="#"><img src="image2.jpg" alt="image" /></a>
 <a href="#"><img src="image3.jpg" alt="image" /></a>
 <a href="#"><img src="image4.jpg" alt="image" /></a>
 <a href="#"><img src="image4.jpg" alt="image" /></a>
</div>

这些图像将被单击以在灯箱中打开。

Answer 1

如果您在帖子的评论中提到，您正在使用 Galleria。

不幸的是，这没有提供 OOTB（开箱即用），您必须通过在您的 div 中添加一个空的#galleria DIV 来自定义库。然后使用 JSON 加载一些画廊数据，当数据准备好后，调用 Galleria 并将 JSON 作为数据源应用。

作为一个简单的替代方案，您可以在 CSS 中指定顶部、底部等，通过这样做您可以控制 div 可能出现的位置，指定尺寸，不要忘记将它们标记为重要。

body .galleria-container.fullscreen{
    top:125px!important; 
    bottom:50px!important; 
    height:auto!important;
}