Question

我正在尝试在网页的页脚中添加js图库的缩略图部分。我以前从未打破过画廊，并认为这是实现这种外观的唯一途径

http://img69.imageshack.us/img69/5923/bsade.jpg

我现在拥有的链接是：http://www.marisaraskin.com/two.html。

（边框只是我的指南，而我还在努力）

缩略图容器的CSS代码是：

.galleria-thumbnails-container {
    height: 100px;<br>
    bottom: 0;<br>
    position: absolute;<br>
    left: 10px;<br>
    right: 10px;<br>
    z-index: 1;<br>
    border:1px solid yellow;<br>
}

我不确定我的其他选择是什么。我可能正在考虑使用z-index将内容容器重叠在页脚上。虽然我很喜欢这个，特别是因为每个人的屏幕分辨率都不同。我可以为每个请求发布更多代码。我不知道你现在还需要看到什么。

如果您需要知道我正在使用名为“Galleria”的画廊js（经典）。

Answer 1

如果我是你，我会修改js脚本，以便您可以填充实际HTML代码中不连续的块，但这是通过css完成所有操作的粗略方法：

从#container

position:relative

从.galleria-container

position:relative

将position:absolute添加到.galleria-stage并向左和向右删除定位。另外，添加top:90px（或接近它的东西）和给它一个宽度：width:920px。
更改.galleria-thumbnails-container以使用绝对定位和使用bottom:___属性将其设置为您所属的位置。

基本上你在这里做的是删除画廊的父元素中的所有相对位置，以便画廊段全部相对于页面而不是任何父元素定位。完成此操作后，您只需修改舞台块和缩略图块的绝对定位和宽度，使它们位于您想要的位置。

JS Gallery的缩略图放在页脚中

1 个答案: