EBI-Framework
EBI-Framework copied to clipboard
Responsive menu sub-menu bug
(Posting on behalf of Ardan Patwardhan)
The responsive "Also in this section" will sometimes not render sub-menus correctly. The behvaiour only occurs when there is one sub-menu in the sub-menu. If there are two, everything is fine.
The bug was first noticed on http://wwwdev.ebi.ac.uk/pdbe/emdb/emdb_2017
Attempts to destroy and/or re-init the foundation dropdown menu plugin do not seem to help.
In the meantime there is a workaround by adding an invisible child menu item:
<li style="">
<a href="#">A workaround</a>
<ul class="menu"> <li><a href="#">for a bug where the dropdown menu fails sometimes unless there are two submenus in the submenu</a></li></ul>
</li>
Other single-child menus seem to work fine. Unsure if this is a Foundation bug or how we're making the responsive menu, though all appears to be fine.
We could push this workaround into foundationExtendEBI.js
var responsiveMenuSubMenuBugFix = '<li class="bug-fix-placeholder" style="display:none !important;"><a href="#">A workaround</a> <ul class="menu"> <li><a href="#">for a bug where the dropdown menu fails sometimes unless there are two submenus in the submenu</a></li></ul> </li>';
$(localMenuClass).append('<li class="extra-items-menu"><a href="#">Also in this section</a><ul class="menu">'+responsiveMenuSubMenuBugFix+'</ul></li>');