EBI-Framework icon indicating copy to clipboard operation
EBI-Framework copied to clipboard

Responsive menu sub-menu bug

Open khawkins98 opened this issue 8 years ago • 4 comments

(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>');

khawkins98 avatar Nov 02 '16 14:11 khawkins98