Menu icon Foundation
Top-Bar not working on one page

I use simple top-bar code and it has been working fine. However, iPhone 6 is not switching to the hamburger Menu for our Home page. Code is same for all our pages and all the other pages work just fine. People have to turn the iPhone on side to see the menu and it is the full menu - not hamburger. 

I have been fortunate I did not have to change the basic code for our site so have never changed the media query statements. Is this what I need to do in order for this to work? If so - I don't understand why all the other pages show up OK. It is the one page error that is throwing me.

Is there something intrinsically different in how the first entry in Top-Bar displays compared to other pages? 

Any hints on how I could begin to get to the bottom of this would be helpful. It really is a very generic use of the top-bar. Using Foundation 5.

Thanks.

top-barResponsive

I use simple top-bar code and it has been working fine. However, iPhone 6 is not switching to the hamburger Menu for our Home page. Code is same for all our pages and all the other pages work just fine. People have to turn the iPhone on side to see the menu and it is the full menu - not hamburger. 

I have been fortunate I did not have to change the basic code for our site so have never changed the media query statements. Is this what I need to do in order for this to work? If so - I don't understand why all the other pages show up OK. It is the one page error that is throwing me.

Is there something intrinsically different in how the first entry in Top-Bar displays compared to other pages? 

Any hints on how I could begin to get to the bottom of this would be helpful. It really is a very generic use of the top-bar. Using Foundation 5.

Thanks.

This post has been closed. No new replies can be added.

Sherry Bradford over 1 year ago

I figured this out. There were two issues: a video that had a width setting, and not setting appropriate small sizes within the code. Set the width for the video to auto and put in my small sizing and now the navigation works fine. I do find that it does NOT work on the iPhone 5 unless they turn the screen horizontally. I'm sure that is likely a sizing setting. I'll hold off on tweaking that for now since we are an intranet and most people do not use phones to access. But it works fine on the iPhone 6 and above and any of the other devices that are about that size.

I figured this out by combing through Foundation documents, the forum, and Stack Overflow suggestions. So very grateful for all the folks who contribute to the forum, Foundation documentation, and the broader community of web developers out there.