O hover funciona perfeitamente em máquinas que não possuem telas sensíveis ao toque. Você obtém o efeito de hover com um mouse ou o cursor do touchpad, por exemplo, aqui estou passando o mouse sobre o botão de compartilhar:
Mas para laptops que possuem tela sensível ao toque e mouse/touchpad… não tenho certeza se existe uma maneira de detectar quando o mouse está desconectado versus conectado.
Não sei se há alguma maneira de corrigir isso por meio da detecção de mídia CSS4:
Mas seria bom conseguir corrigir isso para dispositivos que aparecem como ambos tela sensível ao toque e mouse — para permitir o hover neles. Os usuários recorreram a desativar a tela sensível ao toque em seus laptops para fazer funcionar, provavelmente porque nunca usam a parte da tela sensível ao toque de qualquer forma.
Testei isso .. https://jsfiddle.net/davidThomas/q29r4pjs/3/ e obtive:
- desktop
mouse - iphone
toque - surface pro mouse ← errado!
Também testei https://jsfiddle.net/Blackbam/zkd2cs0t/16/ e os resultados foram os mesmos — o dispositivo com tela sensível ao toque + mouse aparece idêntico ao desktop.