0

現在取り組んでいる Web サイトに Javascript の Show/Hide ナビゲーション バーがあり、サブ ナビゲーション onclick が表示されます。ただし、ユーザーがサイトのそのセクション内にいるときに、非表示のサブナビゲーションが自動的に表示されるようにしたいと思います。

これは私のJSです：

    <script type="text/javascript"><!--
    function HideContent(d) {
    document.getElementById(d).style.display = "none";
    }
    function ShowContent(d) {
    document.getElementById(d).style.display = "block";
    }
    function ReverseDisplay(d) {
    if(document.getElementById(d).style.display == "none") { document.getElementById(d).style.display = "block"; }
    else { document.getElementById(d).style.display = "none"; }
    }
    //--></script>

これは HTML の例です。

    <nav class="sub-nav" id="company-nav" style="display: none;">
        <div class="container">
            <ul>
                <li><a href="#">About</a></li>
                <li><a href="#">History</a></li>
                <li><a href="#">People</a></li>
            </ul>
        <img src="/2013/img/blue-nav-arrow.png" border="0" alt="arrow" />
        </div>
    </nav>

これは、すべてのサブナビがデフォルトで非表示になっているホームページからは正常に機能しますが、たとえば、ユーザーが [About] ページに移動した場合、デフォルトで company-nav サブナビを表示したいと考えています。

JS や CSS でこれを実現できるかどうかはわかりません。私は少しさびているので、提案をいただければ幸いです。ありがとう。

4

1 に答える 1

0

できることは、個々のページidに body タグの があり、CSS を介して、idがアクティブな場合はサブメニューを表示することです。

例 (ページについて):

HTML:

<body id='about'>
<nav id"company-nav">
<li><a href="#">About</a></li>
<li><a href="#">History</a></li>
<li><a href="#">People</a></li>
</nav>
</body>

CSS:

#about nav#company-id{
display:block;
}

お役に立てれば。

于 2013-05-23T09:48:22.450 に答える