Foundation top-bar not working on iPhone? I’m going to save you the hair-tearing experience I’ve just been through – Zurb Foundation based WordPress website, based on FoundationPress¬†and it was all working fine – right up until the point where I discovered that the Foundation top-bar was not working on iPhone.

Cue hours of fiddling, trying things that almost worked (but crucially, didn’t…) and near tears because visitors on iPhone make up a healthy proportion of my traffic.

The problem was, the toggle wasn’t working on the iPhone; absolutely fine ‘n dandy on Android and desktop. It turns out there’s a bug in Foundation 5 that can trigger under certain circumstances, and this is how you fix it:

Drop this into your footer:

<script> $(document).foundation(); $(a.left-off-canvas-toggle).on(click,function(){ }); </script>

You know the worst bit? I’ve had to use this before and had totally forgotten (face palm). It’s not the only solution, but is the easiest to implement.

For more information and a grand list of other peoples top-bar iPhone issues, visit this thread at the Zurb Foundation forums.

Socially enable us...Tweet about this on Twitter0Share on Facebook0Share on Google+0Share on LinkedIn0Share on Reddit0Share on StumbleUpon0Pin on Pinterest0Share on Tumblr

Leave a Reply