Opened 9 years ago

Closed 9 years ago

#6975 closed bug (notabug)

accordion w/ collapsible & focus styling

Reported by: brewster1134 Owned by:
Priority: minor Milestone: 1.9.0
Component: ui.accordion Version: 1.8.9
Keywords: Cc:
Blocked by: Blocking:

Description

when the accordion is set to collapsible, and after a header is clicked to collapse the content, the class ui-state-focus should be removed from the header. for me, this was fixed with.... not sure where this functionality would go in the accordion.js tho...

$('div.ui-accordion-header').mouseleave(function(){

$(this).removeClass('ui-state-focus');

});

Change History (1)

comment:1 Changed 9 years ago by danheberden

Resolution: invalid
Status: newclosed

Thanks for taking the time to submit a bug report. Next time, could you make it a live demo on jsfiddle.net? It helps use out quite a bit to not have to recreate your issue.

I went ahead an made on for this, though, to show what's going on. When you collapse the heading, it still IS in focus, hence the class.

Check it out: http://jsfiddle.net/danheberden/sp7yN/

See how when you close the heading, it's still highlighted? Cuz it's still focused. Why? Use your keyboard controls: press space to open and close it. Use your arrow keys to move up and down closed heads. See how the closed headings can have focus?

To summarize, it's a accessibility thing. If your application needs to have it removed, then by all means, use your code snippet. But this is operating as designed :)

Note: See TracTickets for help on using tickets.