input fields on ios causing the navbar to hide

[morrow95]

Not sure if this has been going on for awhile now and I never noticed it or this is due to a newer version of this script.

I have a user login dropdown in my nav with two input fields. When the menu is collapsed (iPhone on ios) the menu works fine, BUT as soon as I tap any of the input fields the menu hides. I believe this is due to ios slightly zooming in the screen so the script thinks it scrolled and hides it.

I honestly don't remember this ever happening before as I would think I would have noticed it... plus I usually test things out pretty thoroughly. The only things that have changed recently are :

• bootstrap 3.3.7
• jquery 3.1.0
• this plugin to 1.0.5

I 'think' I previously had 1.0.2 or 1.0.3 installed - I know it didn't have the navbarOffset option. Is there anything in the code since those that would cause this? Possibly the new bootstrap or jquery?

[morrow95]

Thinking about this some more just now. Assuming the issue is what I think... the zooming of the screen makes the plugin think the page scrolled and closes the nav... what about 'disabling' navbar hiding if class="navbar-collapse collapse in" is present? The 'in' class just means the navbar is in a collapsed state and open or in other words you are in mobile view with the navbar open.

If that sounds reasonable it might be worthwhile to add a don't hide on mobile view option as well.

[morrow95]

Kind of a hack, but I was able to make my solution work and prevent the navbar from disappearing when ios zooms in on the screen after touching an input field (in my case the username/password fields).

Added a condition in the script, but this requires you have an id 'navbar' set on your actual menu contents :

  function hide(autoHidingNavbar) {
    if (!_visible || $('#navbar').hasClass( 'in' )) {
      return;
    }

the html I use for my menu contents :

<nav id="navbar" class="navbar-collapse collapse">

which will have a class of 'in' added when in mobile/collapsed view and it is open.