WordPress.org

Make WordPress Core

Opened 18 months ago

Closed 17 months ago

Last modified 17 months ago

#22382 closed defect (bug) (fixed)

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

Reported by: azaozz Owned by: azaozz
Milestone: 3.5 Priority: low
Severity: minor Version: 3.5
Component: Administration Keywords: mobile
Focuses: Cc:

Description

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.

Change History (11)

comment:1 nacin18 months ago

  • Component changed from Menus to Administration
  • Keywords mobile added

comment:2 follow-up: georgestephanis18 months ago

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.

comment:3 nacin18 months ago

  • Owner set to azaozz
  • Status changed from new to assigned

comment:4 in reply to: ↑ 2 azaozz18 months ago

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.

Last edited 18 months ago by azaozz (previous) (diff)

comment:5 SergeyBiryukov18 months ago

#22428 was marked as a duplicate.

comment:6 miqrogroove18 months ago

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

comment:7 johnbillion17 months ago

  • Cc johnbillion added

comment:8 azaozz17 months ago

  • Resolution set to fixed
  • Status changed from assigned to closed

In 22636:

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

comment:9 miqrogroove17 months ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

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

comment:10 miqrogroove17 months ago

  • Resolution set to fixed
  • Status changed from reopened to closed

A full upgrade fixed it. Thanks guys :)

comment:11 miqrogroove17 months ago

Likely related: #22505

Note: See TracTickets for help on using tickets.