In iOS 6.01 (Safari) the top menu items have to be "touched" twice to show the submenu

[azaozz]

As the title. The first touch highlights the menu item, the second shows the submenu and the third follows the link.

This is most likely due to our JS for making the menus work on touch screens and Win phone, #20614.

[georgestephanis]

It is. As the menu theoretically has a hover state, the first one would trigger the hover state, but not pass through to a click.

What I'd like to do, if we can, is test for the sub-menu being :visible on a click. If it has a sub menu, and the sub menu isn't visible, then we do our thing. This would also let us apply it to cases where wp_is_mobile() is false -- for example, laptops with touch inputs where the user is just touching things, but IE (boo hiss) doesn't have or pass an onTouchStart event.

Basic logic being ...

Oh, you've clicked on a menu item. How nice. Do I have a child menu? Why yes, I do! { Is that child menu visible } ? { Do nothing! } : { Show the child menu; preventDefault }

So if they're hovering over the item before they click it, it won't do anything. But if it detects a click without a hover (touch ui) it shows the menu and bails.

[azaozz]

Replying to georgestephanis:

What I'd like to do, if we can, is test for the sub-menu being :visible on a click. If it has a sub menu, and the sub menu isn't visible, then we do our thing...

This sounds interesting to try to implement.

Basic logic being ...

Oh, you've clicked on a menu item. How nice. Do I have a child menu? Why yes, I do! { Is that child menu visible } ? { Do nothing! } : { Show the child menu; preventDefault }

Not exactly, the current behaviour for PCs is

"{ Is that child menu visible } ? { Don't care. There was a click so follow the link }"

which for touch screen devices should be

"{ Is that child menu visible } ? { No? Show it. Yes? Follow the link }"

So if they're hovering over the item before they click it, it won't do anything. But if it detects a click without a hover (touch ui) it shows the menu and bails.

Yeah, that may work. Thing is how exactly the touch devices emulate hover. Seems that currently in iOS the first touch on a top menu item is interpreted as "set hover state and bail" and the second touch actually does a 'click', so click without a hover doesn't happen.

[SergeyBiryukov]

#22428 was marked as a duplicate.

[miqrogroove]

Make it like the admin bar. The admin bar is working wonderfully now. See also #22065

[azaozz]

In 22636:

Make the admin menu and toolbar work well on mobile devices (take 2), props georgestephanis, fixes #20614, fixes #22382

[miqrogroove]

Good improvement. However, it still takes two taps to navigate from one sub item to another sub item.

[miqrogroove]

A full upgrade fixed it. Thanks guys :)

[miqrogroove]

Likely related: #22505