Skip to content

24 ways to impress your friends

Vote down?

Patrick H. Lauke

Internet Explorer 10 on Windows 8 uses the aria-haspopup attribute to simulate hover on touch devices

note that this behavior has been removed in IE11 now.

We can cover keyboards with our friend :focus

but this only works if the :hover was applied to a focusable element, and if the bits that you then interact with aren’t child elements of that element. so, for instance, in the touch/hover switcher example, even keyboard users need to change to the touch variant, as the hover one simply doesn’t do anything when just focussing with the keyboard (as the hover effect is applied to the div (so can’t focus, so that extra :focus state never happens). even if we added a tabindex=-1 on the div to force keyboard focusability, as soon as the user tabs to get to the actual “Add to cart” button, :focus is lost again and the user tabs to the now hidden button.