: hover behavior on mobile devices

Question

When developing a mobile navigation menu for a site that I will redesign, I found that a number of mobile browsers fire a CSS: hover event by clicking, including Chrome, FlashFox and the default browser on Android 4.x, as well as Safari on iOS 7. Is Is this behavior common enough to rely on? I guess problems may occur with Android 2.x phones.

I am wondering if anyone has experience with this, and if this behavior is safe for my navigation menu. Also is there any spec that defines this behavior, or did it just appear? From what I saw, it seems to work pretty evenly on all devices.

I have already made mobile navigation menus using JavaScript, but that would be a good alternative.

I know that there are several questions that relate to this topic in stackoverflow, but they are quite old, and I could not find any question regarding specifically what I wanted to know.

EDIT: To clarify, the site is being developed with responsive design, and I'm not just trying to use the desktop navigation bar with: hover. The menu is formatted for mobile devices, and: hover will replace the need for JavaScript to display the submenu when selecting a menu item.

Answer 1

Some say use :hover , others say use :active . I say to use both (in one rule), and the device will use one (or both) that works on this device.

I find this to work. Anyway.

Hope this helps.