html - Foundation 6 粘性菜单。当页面滚动回顶部时,左侧菜单 div 向上推

标签 html css zurb-foundation-6

所以我有一个粘性导航栏,当页面向下滚动并返回时,右侧导航栏保持不变,但其余导航栏被向上推离屏幕。我已经尝试了各种方法,但就是想不通,我假设我已经看过一些东西,所以希望大家能提供帮助。

HTML:

<div data-sticky-container>
  <div class="title-bar" data-sticky data-options="marginTop:0;" style="width:100%">
    <div class="title-bar-left">
      <ul class="menu">
        <li class="menu-text">TITLE</li>
      </ul>
    </div>
    <div class="title-bar-right">
      <ul class="menu">
        <li><a href="#">link</a></li>
        <li><a href="#">link</a></li>
        <li><a href="#">link</a></li>
        <li><a href="#">link</a></li>
      </ul>
    </div>
  </div>
</div>

没有包含任何 CSS,因为它回到了 Foundation 文件中的标准 CSS。

希望这足以继续并提前致谢。

最佳答案

我遇到了同样的问题,这个样式修复对我有用:

.sticky.is-anchored { 
    bottom: auto !important;
}

关于html - Foundation 6 粘性菜单。当页面滚动回顶部时,左侧菜单 div 向上推,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35897558/

相关文章:

html - 如何从 HTML/CSS 中的表格中删除单元格?

css - 全屏响应式背景图片

javascript - CSS - 关闭 Canvas 问题

html - 图像对齐问题

jquery - 表格单元格内具有动态内容的 Div 和表格行高对齐

html - 表格列标题中的杂散边框

javascript - Foundation Reveal 正在删除 DOM

html - Zurb Foundation 6 app.scss 与 _settings.scss

jquery - 引导模式关闭后,html5 视频继续在后台播放

javascript - 如何动态地将一个 div 中的元素包装在另一个 div 中?