Menu icon Foundation
Issue with hide-for-medium drilldown when browser is resized

Hello,

 

Just wanted to see if anyone else has experienced the same issue as me. I have a drilldown menu that only appears on small screens, so I have the hide-for-medium class applied to the container div. It works great if the page is loaded in small screen orientation, but when the page is loaded at medium or large size, then resized to small, the drilldown menu is completely blank. It will just show a blank white box where the drilldown menu should be. If I then refresh the page in a small orientation it loads just fine. 

Now if I remove the container div's hide-for-medium class, it loads and resizes fine on any screen size. So it's something with using visibility classes and drilldown together. 

Any thoughts on this? And sorry, I do not have a codepen or anything setup. I'm using code pulled directly from the docs to avoid any customizations from messing it up. I'm using Foundation 6.2.3 

 

Thanks in advance!

drilldownvisibility classes

Hello,

 

Just wanted to see if anyone else has experienced the same issue as me. I have a drilldown menu that only appears on small screens, so I have the hide-for-medium class applied to the container div. It works great if the page is loaded in small screen orientation, but when the page is loaded at medium or large size, then resized to small, the drilldown menu is completely blank. It will just show a blank white box where the drilldown menu should be. If I then refresh the page in a small orientation it loads just fine. 

Now if I remove the container div's hide-for-medium class, it loads and resizes fine on any screen size. So it's something with using visibility classes and drilldown together. 

Any thoughts on this? And sorry, I do not have a codepen or anything setup. I'm using code pulled directly from the docs to avoid any customizations from messing it up. I'm using Foundation 6.2.3 

 

Thanks in advance!

Ryan Patterson over 3 years ago

I also wanted to mention that I have tried using show-for-small-only class instead of hide-for-medium, but same behavior. 

 

I also tried the opposite of what I was doing above. I added show-for-medium, but when the page loads on a small screen then resized to be medium or large, the drilldown is blank as well. 

Ryan Patterson about 3 years ago

Wow...6 months and no replies, not even a question for me to clarify anything or provide an example link. bummer.