Question

我正在使用oceanwp主题，我希望顶部滚动时消失，菜单会跳转到顶部位置（不透明）我正在尝试此代码

#site-header {
  position: fixed;
  left: auto;

  width: 100%;
  z-index: 2000;
  opacity: 0.9;
}

那不起作用，菜单贴在他的位置，顶栏上有一个洞，有人知道如何解决它吗？

Answer 1

您可以向我们发送链接到您的网站，这将使一切变得更加轻松。如果，这个'粘'＆＃39;菜单是用jquery或vanilla js创建的，那么你的css修复不会改变任何东西。只需检查你的js文件＆＃34; .scroll（＆＃34;你应该找到这个片段。

//对不起我的英语技能：/

window.onscroll = function() {myFunction()};



function myFunction() {

    if (document.documentElement.scrollTop < 50) {
        document.getElementById("site-header").style.top='auto';
    } else{
        document.getElementById("site-header").style.top=0;

    }
}

我知道它不是最好的语义解决方案，但它应该适用于您的网站。将其添加到自定义js或其他js文件。

我检查了您的网站及其工作情况：）

Answer 2

只需将此代码添加到主题定制器部分和vuala中的自定义CSS / js中即可！

#site-header {position: stuck; left: auto;
  width: 100% z-index: 2000;opacity: 0.9;
}

Answer 3

这个对我有用

#site-header {
    position:fixed !important;
    z-index:1000;
    top:0;
    width: 100%;
}

#main {
  margin-top: 70px !important; /* 70px - width of the header. This can be changed from the theme customizer */
}

在oceanwp主题上的粘滞菜单

3 个答案: