粘滞侧导航/面板

-1

所以我只是希望边导航粘到位置的高度和滚动与用户，因为他们沿着页面走，但没有绝对的，相对/固定的组合似乎工作。粘滞侧导航/面板

这里是CSS

.side-panel { 
    padding: 30px 0; 
    position: absolute; 
    Z-INDEX: 30; 
} 
.b > ul { 
    position: absolute; 
    left: -110px; 
    transform: translate(0) translateZ(0); 
    width: 150px; 
    transition: transform .3s .1s ease-in-out; 
}

下面是HTML：

<div class="side-panel b"> 
     <ul> 
     <li><a href="#home"><span class="entypo-plus-circled"></span><span class="menu-item">Home</span></a> 
     </li> 
     <li><a href="#Environment"><span class="entypo-plus-circled"></span><span class="menu-item">Environment</span></a> 
     </li> 
     <li><a href="#Certification"><span class="entypo-mail"></span><span class="menu-item">Certification</span></a></li> 
      <li><a href="#NAHB"><span class="entypo-doc-text-inv"></span><span class="menu-item">NAHB</span></a></li> 
      <li><a href="#FAQs"><span class="entypo-layout"></span><span class="menu-item">FAQs</span></a></li> 
     </ul> 
    </div>

来源

2016-06-17 Hot Java

这是你想要做什么？ https://jsfiddle.net/bgandy94/xLvtkud2/

我刚刚将.b > ul标记更改为固定位置，它会像您提到的那样滚动页面。

来源

2016-06-17 18:43:46 OysterMaker

不起作用，我玩过绝对和静态，所以我不知道为什么它不想移动。 –

也许我误解了你想要的导航功能。在我提供的小提琴中，随着用户向下滚动页面，导航栏保持原样。这不是你想要的吗？ @moliminous – OysterMaker

粘滞侧导航/面板

回答

相关问题