导航 - 修正

时间:2016-06-03 16:22:52

标签: jquery css navigation

我试图创建一个导航稍微复杂的网站。我已经让导航看起来像我想要的初始加载,但现在我想在滚动时将它粘到导航到顶部。当导航栏到达顶部时,我已经能够创建一个类,但无法将其设置为粘性。每次我添加一个位置它都会跳回来。任何建议或帮助都会很棒。

以下是网站:http://www.figadvertising.com/anne/

需要在滚动上修复的div是moduletable_menu,当它到达页面顶部时,它还会将主导航滚动添加为类。

2 个答案:

答案 0 :(得分:1)

在添加课程main-nav-scrolled时,声明以下样式会将相关导航修复到菜单顶部。

<强> CSS

.main-nav-scrolled .top-menu li {
    display: inline-block;
    float: none;
}

.main-nav-scrolled .top-menu {
    position: fixed;
    top: 0;
    bottom: auto;
    z-index: 9;
    left: 0;
    right: 0;
    width: 100%;
    text-align: center;
}

答案 1 :(得分:0)

看起来你真正需要的是将实际样式添加到.moduletable_menu ul元素而不是父元素。因此,只需将以下样式添加到子元素(在DevTools中测试):

.moduletable_menu.main-nav-scrolled ul {
  position: fixed;
  top: 0;
  bottom: auto;
  z-index: 100;
}

目前,它似乎没有任何与新class相关联的样式。试试这个,让我知道它是否适用于你!