superfish
superfish copied to clipboard
joeldbirch
Menus all open if hidden by a media query on superfish.init()
If superfish.init() is called when the superfish menu is hidden (as by a media query setting display: none) then the hide() method opens all of the menus. When the browser grows to a size that is intended to show the superfish menu then all of the dropdowns are open and shown.
I noticed that the hide method calls $ul.show() and then $ul.stop(true, true) to attempt to instantly re-hide the menu. I'm not clear on why it does this, but it looks like something about the $ul.stop() call does not work when the menu is display: none.
Interesting find. I'll keep it in mind when working on the next release. Thanks.
I did solve this. I set the .style property of the offending div to display: block, call superfish.init(), and immediately hide it again. There is no flash because javascript doesn't return to the browser during this operation. Sometimes it causes an error message on IE8, which we deal with by returning if .style is null or undefined.
I believe that if you comment out line 141 in superfish.js, namely this: $ul.show();
... it will work fine
I've seen this issue when there is an iframe on the page. The full menu tree is expanded when you first hover over a menu item, the fix suggested by raduGaspar seems to work.
I'm just wary that the fix suggested by @raduGaspar may cause other bugs. I remember I added that code for a reason.
When the browser grows to a size that is intended to show the superfish menu then all of the dropdowns are open and shown.
When exactly does a browser "grow"? Is this a realistic scenario (e.g. happens when changing device orientation on iPad)? If not, seems like an implementation concern to me.
FYI - https://github.com/joeldbirch/superfish/issues/158#issuecomment-232315795
When you resize a desktop browser. It could happen when you rotate your ipad, sure.
We are facing this issue in IE11 only and is there any plans for releasing official fix?
