Home › Forums › JavaScript › Close menu on click of Options button and outside of container
- This topic is empty.
-
AuthorPosts
-
April 11, 2016 at 10:47 am #240449
Shikkediel
ParticipantI’m tapping out as I’m not familiar with the aria standard. Maybe another member has more experience with it. The basic jQuery (changing the attribute) should be as mentioned though.
April 11, 2016 at 2:12 pm #240452Anonymous
InactiveHello,
A staff member from WPMU DEV helped me figure out why it is not working, but we did not have time in the chat session to come up with a fix.Quoted text:
“But for quick look it does that for wrong element – when I check this jQuery lib it adds it to the actual sub menu, not the parent .”Any suggestions?
Thanks so much for your help.
April 11, 2016 at 2:17 pm #240453Anonymous
InactiveHello,
Just to remind, you can view the menu over here.
http://yourtechadvisors.com/forums/topic/options-menu-test/Click login and use these details.
Username: css-tricks
Password: test#123Thanks.
April 11, 2016 at 2:32 pm #240456Anonymous
InactiveHello,
Sorry, updated link.
http://yourtechadvisors.com/forums/topic/testing-menu/Thanks.
April 11, 2016 at 7:48 pm #240462Shikkediel
ParticipantReading the site, I understand it might be quite impossible for you to create a Codepen. But I really have no idea which element should be selected for the screen reader. You could give this variation a go :
jQuery(document).ready(function($) { $('.bbp-admin-links:even').css({position: 'absolute', right: 380}); $('.bbp-meta ul.bbp_custom_links_menu li.parent > a').click(function(e) { var options = $(this).closest('ul'); if (options.attr('aria-expanded') == 'true') options.attr('aria-expanded', 'false'); else options.attr('aria-expanded', 'true'); $(this).next('.bbp_custom_links_submenu').toggle(); e.preventDefault(); }) .on('mouseup touchend', function(e) { e.stopPropagation(); }); $(document).on('mouseup touchend', function(e) { if (!$(e.target).closest('.bbp_custom_links_submenu').length) { $('.bbp_custom_links_submenu').hide(); $('.bbp_custom_links_menu').attr('aria-expanded', 'false'); } }); });
April 12, 2016 at 10:11 am #240486Anonymous
InactiveHello,
Still not working, any more suggestions?Thanks.
April 12, 2016 at 10:50 am #240489Shikkediel
ParticipantNot really, since I am not using that screen reader. I think it’s up to yourself now to figure out which one is the relevant element, then change these two lines to match it :
var options = $(this).closest('ul');
$('.bbp_custom_links_menu').attr('aria-expanded', 'false');
April 12, 2016 at 12:26 pm #240490Anonymous
InactiveThanks.
-
AuthorPosts
- The forum ‘JavaScript’ is closed to new topics and replies.