如何使高浮动自定义叠加Z-index工作？

Question

我已经实现了高滑动自定义叠加层，以包含“下一个”和“上一个”链接，以便在图像之间导航。我需要链接相对于屏幕，因为我正在做一个响应式网站。所以我设置了hs.registerOverlay({ relativeTo: 'viewport' });。但接下来发生的事情是“下一个”和“前一个”链接总是出现在扩展器下，无论我强制使用任何包含元素的Z索引。如何让Z-index工作？

Answer 1

我认为你不能用z-index值来解决这个问题，因为Highslide脚本本身都会渲染这两个对象（扩展器和覆盖层），它会强加自己的堆叠顺序。

解决此问题的最简单方法是限制扩展器的大小。假设你的链接被放置在视口的底部，它们的高度是30px。将hs.bottomMargin从默认值15改为45，你会没事的。