Links active when clicking out of mobile-menu
stezu opened this issue · comments
If that title sounds confusing, you're not the only one. Basically when the nav is visible on small screens, you can click on the document to close the nav. If that click on the document lines up with a link on the page, you actually click on that link (which I find mildly infuriating). If we can disable all links on the page so that when you click on the document to close the menu you don't navigate to another page unintentionally that would be great.
Good catch. I wonder if it would be enough for our document touch/click handler to return false at the end, to keep the click from doing what it would normally do. I haven't actually tried this yet.
Actually, now that I think about it, by the time the click makes it to the document, it will probably already be done interacting with the link, and it will be too late to prevent the default action. It's still worth a try, but if it doesn't work...
- We could manually disable all of the $('a') on the page, but that seems invasive
- We could add a transparent div covering the rest of the page to block the clicks. It might be a little tricky to calculate which parts of the page should be blocked (e.g. should it also block the navigation button?)
I'd be curious to know how (if?) other mobile nav menus handle this. But not curious enough to actually do any research at the moment.
I think Wikipedia uses an extra transparent div.
I thought that since this problem only presents itself on touch screens that even a small delay on the menu hiding animation would alleviate the problem. It looks like a touch on the screen persists for way longer than a click does, if we can get rid of that extra time with an animation delay it would probably fix it (assuming touch persists for a standard amount of time across all devices).
I like the idea of a transparent div the most, it would disable the .navbar-label but that's not a big deal since it does the same thing as clicking on the document anyways. It seems like the cleanest solution.
This will get fixed with the other pull request.