让谷歌地图保持低于粘性导航

Question

在网站上工作，它涉及sticky.js粘性导航和谷歌地图。我添加了地图和粘性导航。一切都运行得相当顺利，但谷歌地图与粘性导航不相同。当我向上或向下滚动时，导航落在谷歌地图后面而不是覆盖它，就像它对页面上的每个其他元素一样。因此，要进一步描绘问题的图片：当我滚动时，导航栏会粘到页面顶部。它涵盖了它传递的任何内容，但谷歌地图覆盖了它，并创造了糟糕的体验。我希望这是足够的信息，以获得一个有用的答案。谢谢大家。

Answer 1

z-index属性指定元素的堆栈顺序。

堆栈顺序较大的元素始终位于堆栈顺序较低的元素前面。

  

注意：z-index仅适用于定位元素（位置：绝对值，   position：relative，或position：fixed）。

例如，如果导航栏的z-index为2且地图为1，则导航栏将始终位于地图上。

写成

    .sticky_nav{
         z-index:2;
    }

Answer 2

将proparty z-index添加到您的sticky-nav类 比如你的粘性nav class =“sticky_nav”

所以在你的css文件中放置那个类

     .sticky_nav{
      z-index=2010;
      }

我把这个值放在2010年因为我不知道究竟是什么谷歌地图z-index值。或者还有其他一些问题.. 或提供您的网站链接..我们检查 快乐编码:)

Answer 3

谢谢大家的意见。当我在使用粘性导航器处理另一个问题时，我偶然发现了它。 sticky.js jquery插件设置了一些默认值，其中一个是将z-index设置为auto。我能够将z-index更改为2，这解决了我的问题。谢谢大家的帮助。