2017-06-01 8 views
1

のNAVをスクロール/固定、私は私がいる問題がアクティブな状態であるfullpage.js http://turnwall.com/demos/webdev_part11/index.html http://www.turnwall.com/articles/adding-single-page-scrolling-navigation-to-your-site/がfullpage.jsセクションページ

で作業するには、以下の例では、固定ナビゲーションを取得しようとしていますどのアンカーが通過/クリックしたかによって表示されません。私が違ったのは、参照/アンカーIDとしてsection 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> 

答えて

0

私はいくつかのセクションにアクティブ ている、とだけNAVにすべての単一のセクション を表示していない/を参照する1アクティブ「のアンカー」の柔軟性が必要です。

this answerで詳しく説明した独自のメニューを作成してください。 この場合、menuオプションを使用する必要はありません。より多くのカスタムメニューを必要とするので、複数のセクションに対して同じ要素をアクティブにします。

関連する問題