Tackling Mobile Sub Menus

[ChrisP]

Hi all,

I have been working on a project for a little bit now, and I’ve come to a fork in the road, and need some guidance.

The navigation menu for my project has a sub menu for two tabs, and a second sub menu for one of those tabs.

Up until recently, I’ve been committed to just giving the the sub menu the ol’ `display: none` for my convenience, but I realize this isn’t the best approach, as I’m limiting the experience for mobile users.

I’m curious to how other people approach this, my thought is there’s probably some jquery out there to disable anchor tags, then change the pseudo-class from :hover to :focus on smaller screens to display the sub menu.

Does anybody have experience with this?

[Paulie_D]

You know that you could set the hover and focus properties to the same don’t you?

In fact it’s recommended.

[Paulie_D]

JQuery mobile events might be of use: http://ben-major.co.uk/2012/05/jquery-mobile-events-finally-launched/

[Author]

Posts