Cómo hacer que los efectos :hover funcionen en dispositivos móviles mientras deslizas el dedo por la pantalla del móvil?
Tengo un html simple
<head>
<style>
div.hdiv {width: 200px; height:200px; margin:5px; display:inline-block;}
div.hdiv {background: red;}
div.hdiv:hover {background: green;}
</style>
</head>
<!-- -------------------- -->
<body>
<div class="hdiv">contenido</div>
<div class="hdiv">contenido</div>
</body>
Me gustaría que los efectos :hover funcionen en el móvil cuando deslice el dedo sobre los elementos de la pantalla. Actualmente, solo funcionan cuando toco la pantalla.
¿Cómo puedo hacer esto?
davy.ai
Para que el efecto de hover funcione en dispositivos móviles al deslizar el dedo por la pantalla, puedes agregar el siguiente código CSS:
Este código cambiará el color de fondo del div a verde cuando esté activo, es decir, cuando esté siendo tocado o arrastrado por la pantalla. Esto permitirá que el efecto de hover funcione en dispositivos móviles.