fullpage.js 部分页面上的固定/滚动导航答案

【问题标题】：Fixed/scrolling nav on fullpage.js section pagefullpage.js 部分页面上的固定/滚动导航
【发布时间】：2017-06-02 17:48:09
【问题描述】：

我正在尝试让下面示例中的固定导航与 fullpage.js 一起使用 http://turnwall.com/demos/webdev_part11/index.html http://www.turnwall.com/articles/adding-single-page-scrolling-navigation-to-your-site/

我遇到的问题是未显示活动状态，具体取决于已通过/单击的锚点。我唯一不同的是不使用部分 ID 作为参考/锚点 ID（部分需要相同的类才能使 fullpage.js 工作）。

还知道 fullpage.js 有它自己的内置导航，但是，我需要一个活动“锚”的灵活性，它指的是/在几个部分上处于活动状态，而不仅仅是显示导航中的每个部分。

不胜感激任何建议！

<script type="text/javascript" src="js/scrolloverflow.js"></script>
<script type="text/javascript" src="js/jquery.fullPage.js"></script>
<script type="text/javascript" src="js/jquery.combinedScroll.js"></script>
</head>

<div id="fullpage">

<nav class="site-navigation page-navigation">
  <ul div="menu">
    <li class=""><a href="#top">Top</a></li>
    <li class="current"><a href="#next">One</a></li>
    <li class=""><a href="#next">Two</a></li>
  </ul>
</nav>
<div class="section" data-color="red">
<div id="right"><img id="sweets" src="work/hav-2.png"/></div>
</div>
   <div class="section" data-color="indigo">
</div>
    </div>
     <div class="section" data-color="grey">
     <div id="next">NEXT PROJECT  ↓</div>

     </div>
</div>

【问题讨论】：

标签： html navigation anchor fullpage.js sections

【解决方案1】：

我需要一个活跃的“锚”指/存在的灵活性活跃在几个部分，而不仅仅是显示每个部分在导航中。

只需按照this answer 中的详细说明创建您自己的菜单。在这种情况下无需使用menu 选项。因为您想要一个更加自定义的菜单，该菜单将为多个部分激活相同的元素。

【讨论】：