开发者

Customize JQuery Accordion behaviour

I am using JQuery's accordion widget. I need a simple generic example which shows how to setup an accordion on a set of divs. When the user selects/expands/activates one of the divs then that div should look different (for example change the background color) than the other divs. Is it possible to do this by just using the accordian's functionality? Or does this need to be done by additional javascript?

开发者_如何学Python

Please note that I am using the accordion that is documented at http://docs.jquery.com/UI/Accordion


Since only the expanded div is visible, why not just set the background for all of them?

The active content has class of ui-accordion-content-active. You could overwrite style for this class.

Another option is to plug in to the change event (copy/paste from docs):

$('.ui-accordion').bind('accordionchange', function(event, ui) {
  ui.newHeader // jQuery object, activated header
  ui.oldHeader // jQuery object, previous header
  ui.newContent // jQuery object, activated content
  ui.oldContent // jQuery object, previous content
});

For example:

$('.ui-accordion').bind('accordionchange', function(event, ui) {
  ui.newContent.addClass('myHighlight');
  ui.oldContent.removeClass('myHighlight');
});
0

上一篇:

下一篇:

精彩评论

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

最新问答

问答排行榜