Question

我是jquery的新手。我正在研究jquery导航这么多天，它现在工作正常，但我想为它添加更多功能。

我有三级嵌套手风琴导航，我想让用户通过对它应用背景颜色来了解它们所在的部分，现在我只能将背景颜色放到它们所处的最后一级，怎么能我还将不同的背景颜色应用于父级。

<div id="accordion">
    <h3><a>Link One - First Level</a></h3>
    <div class="accordionSecond">      
        <h6><a href="#">Second Level</a></h6>
        <div class="accordionLink"> 
        <a href="1.html">1.html</a>
        <a href="2.html">2.html</a>
        <a href="3.html">3.html</a>
        <a href="4.html">4.html</a>
        </div>
    </div>

    <h3><a>Link Two - First Level</a></h3>
    <div class="accordionSecond">      
        <h6><a href="#">Second Level</a></h6>
        <div class="accordionLink"> 
        <a href="1.html">1.html</a>
        <a href="2.html">2.html</a>
        <a href="3.html">3.html</a>
        <a href="4.html">4.html</a>
        </div>
    </div>    

</div>

这里是将背景颜色应用到它们所在级别的css行

.accordionSecond .activeLink { background: #ccc;  color:#000!important; }

jquery标头代码在这里

  <script>
  $(document).ready(function() {
    $("#accordion").accordion( {active: true,  collapsible: true, header: "h3", autoHeight: false, navigation: true, event: 'mouseup'}); 
    $(".accordionSecond").accordion( {active: true,  collapsible: true, header: "h6", autoHeight: false, navigation: true,event: 'mouseup'});
  });
  </script>

<script type="text/javascript">
$(document).ready(function(){
     var path = location.pathname;
      jQuery("a[href$='" + path + "']").addClass("activeLink");
});

谢谢

Answer 1

嗨，看看click api，它演示了还添加了一个类（假设你在你点击的标题中添加了一个'active'类）以及你请求的行为类型。显然你必须扩展这个演示，但应该有很多在线添加和删除类的例子。

Jquery手风琴多级导航

1 个答案: