开发者

jQuery UI accordion with named anchors, not toggling menu selection

Using a jQuery UI accordion menu (navigation: true) with named anchor targets for the menu items, i.e. menu items refer to named anchors on the current page.

Accordion works fine with highlighting a clicked menu item if navigating to a different page, but if the menu item refers to a named anchor on the current page it does not change the menu selection/highlight upon clicking (though the link causes the page to scroll to the correct anchor as expected). The location hash is updated with the anchor, but the clicked menu item is not highlighted.

Not doing anything fancy otherwise. Below is a sample accordion menu that demonstrates the problem. When any of the menu items are clicked on, the accordion does not highlight that menu item to reflect that it is the current menu item.

I want it to highlight the menu item when it is clicked and expected accordion to work that way. How can I make it do that?

Is the accordion widget only designed to update/find/highlight the current menu item via the URL hash when accordion initializes on page load?

FYI I'm new to all this. Be gentle ;) TIA

<ul id="navigation">
  <li>
  <a class="head">Menu 1</a>
    <ul>
      <li><a href="#anchor1">Sub-topic 1</a></li>
      <li><a 开发者_如何学JAVAhref="#anchor2">Sub-topic 2</a></li>
      <li><a href="#anchor3">Sub-topic 3</a></li> 
    </ul>
  </li>
  <li>
    <a class="head">Menu 2</a>
    <ul>
      <li><a href="#anchor1">Sub-topic 1</a></li>
      <li><a href="#anchor2">Sub-topic 2</a></li>
      <li><a href="#anchor3">Sub-topic 3</a></li>
    </ul>
  </li>
</ul>

[Added 11-17-2010] Nothing special in my libs or the accordion init code:

jquery-1.4.2.min.js
chili-1.7.pack.js
jquery.easing.js
jquery.dimensions.js
jquery.accordion.js

jQuery().ready(function(){
    $('#navigation').accordion({
        collapsible: true,
        active: 0,
        header: '.head',
        navigation: true,
        autoheight: true,
        animated: 'easeslide'
    });
 });

It all has to do with how the accordion lib treats named anchors.


That is same to. jQuery Accordion active by url?

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜