0

これは、CMS を使用しない初めての Web サイトであり、jQuery で少し迷っています。ユーザーの位置に応じて、固定ナビゲーションバーの要素をアクティブにしようとしています。私は自分のサイトをブートストラップで構築しています。それが scrollspy 関数を使用している理由です。誰かが私が別の方法でそれを行うのを手伝ってくれるなら、それは素晴らしいことです. ここで html、css、および jquery コードを使用してフィドルを作成しました 。また、ここにコードを書き留めます。前もって感謝します。

<body data-spy="scroll" data-target="#top-menu">
<div>
<ul id="top-menu" style="background: green;">
<li><a class="active" href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#portfolio">Portfolio</a></li>
</ul>
</div>
<br><br>

<div id="home">
<p>This is home section</p>
</div>
<div id="about">
<p>About</p>
</div>
<div id="portfolio">
<p>This is the portfolio</p>
</div>
</body>

そしてjqueryはここにあります

4

1 に答える 1

1

コードに ul 要素の「nav」クラスを追加し、リストの親 div 要素のデータ ターゲット値 ID を設定する必要があります。

以下のコードのようなものです。

<body data-spy="scroll" data-target="#top-menu">
    <div id="top-menu">
    <ul style="background: green;" class="nav">
    <li><a class="active" href="#">Home</a></li>
    <li><a href="#about">About</a></li>
    <li><a href="#portfolio">Portfolio</a></li>
    </ul>
    </div>
    <br><br>

    <div id="home">
    <p>This is home section</p>
    </div>
    <div id="about">
    <p>About</p>
    </div>
    <div id="portfolio">
    <p>This is the portfolio</p>
    </div>
</body>
于 2013-06-03T06:01:09.397 に答える