0

ModX でサイト全体のナビゲーションをハードコーディングしましたが、ユーザーがいるページの関連リンクにクラスを追加する必要があることに気付きました。

したがって、our-services.html を使用しているときは、our-services リンクに追加クラスが必要です。

これは後知恵で可能ですか？

これはHTMLです

<!-- Navigation -->
<nav>

    <ul class="menu">
    <li>
            <a href="our-services" title="Our Services">Our Services</a>
            <ul class="sub-nav">
                <li><a href="our-services/networking-events">Network &amp; Evens</a></li>
            </ul>
        </li>
        <li>
            <a href="who-we-work-with" title="Our Clients" >Our Clients</a>
        </li>
        <li>
            <a href="testimonials">Testimonials</a>
        </li>
        <li><a href="blog" title="News & Events" >News & Events</a></li>
        <li>
            <a href="overview" title="Our Services">About Us</a>
            <ul class="sub-nav">
                <li><a href="our-network">Our Network</a></li>
                <li><a href="sectors-and-themes">Sectors &amp; Themes</a></li>
                <li><a href="our-team">Our Team</a></li>
             <li><a href="working-for-the-up-group">Working For Us</a></li>
            </ul>
        </li>
        <li class="last"><a href="contact" title="Contact Us" >Contact Us</a></li>
</ul> 

</nav>
<!-- End Navigation -->

残念ながら、サブメニューは実際にはサブページではありません (レガシー サイト、質問しないでください)。最上位リンク (アクティブのクラス) にクラスを追加するだけです。

4

2 に答える 2

1

ハードコーディングされたメニュー内では、単純ですが正確ではない解決策は次のようになります。

[[*id:eq=`link resource id`:then=`class="active"`]]

Wayfinder スニペットを使用すると、デフォルトで使用されるため、おそらく簡単になりますが、メニューをハードコードする理由があったと思います。

于 2013-09-19T21:47:13.257 に答える
0

ここからこのソリューションを試すこともできます:ページがアクティブなときにクラスを変更する

<script>
   $(document).ready(function(){

       var links = $('nav').children();
       $.each(links, function(key, value){
          if(value.href == document.URL){
           $(this).addClass('current_page_item');
          }
       });
   </script>
    <nav>
        <a href="/link1">link-1</a>
        <a href="/link2">link-2</a>
        <a href="/link3">link-3</a>
        <a href="/link4">link-4</a>
        <a href="index.html">link-5</a>
    </nav>
于 2013-09-20T01:41:15.660 に答える