Hi and sorry for all this delay! It’s been very busy times here lately and I just don’t have the chance to look at the forums very regularly. 😳
It’s not that difficult to use a custom focusable element like a BUTTON
after the link as a sub menu toggle in collapsible mode – this could be implemented as an add-on. But the main problem is moving the ARIA attributes from the link to that element since the script core would certainly need some modifications and this would prevent you from being able to upgrade easily in the future.
What you could do with the original v1.0.x script core, is to use the following mod to make sure links are loaded on first tap in collapsible mode (the sub arrow SPAN’s are now actually sub menu toggle buttons in collapsible mode by default):
// don't show the sub menus in collapsible mode unless the sub arrow is clicked
var $mainMenu = $('#main-menu').on('click', 'span.sub-arrow', function(e) {
var obj = $mainMenu.data('smartmenus');
if (obj.isCollapsible()) {
var $item = $(this).parent(),
$sub = $item.parent().dataSM('sub');
$sub.dataSM('arrowClicked', true);
}
}).bind({
'beforeshow.smapi': function(e, menu) {
var obj = $mainMenu.data('smartmenus');
if (obj.isCollapsible()) {
var $menu = $(menu);
if (!$menu.dataSM('arrowClicked')) {
return false;
}
$menu.removeDataSM('arrowClicked');
}
}
});
But, as you can guess, this will mess the ARIA attributes logic when the menu is in collapsible mode (and mobile screen reader users would not be able to activate the sub menus).