javascript - que - Elemento HTML del dispositivo táctil: estado de desplazamiento

obtener la posicion de un elemento javascript

Question

Hay un botón HTML con 3 fondos, cada uno para estados normales, activados y cliqueados. Por supuesto, funciona bien con dispositivo no táctil. Si se hace clic en el botón en el dispositivo táctil, el: estado de desplazamiento también se activa y permanece hasta que se toca otro elemento.

¿Es posible eliminar mediante programación el estado de desplazamiento del elemento después de hacer clic o evitar que se active en dispositivos táctiles?

Lo sentimos, pero no se aceptan sugerencias para detectar eventos mouseover y mouseout y agregar clases artificiales.

Una posible solución es agregar la clase "sin toque" al elemento html por adelantado y eliminarla si solo se detecta el dispositivo táctil. En ese caso, el selector de CSS "html.no-touch button: hover" no coincidirá con el dispositivo táctil.

¿Conoces soluciones más elegantes que puedas sugerir?

Answer 1

Intentaré sobreescribir el :hover estado de :hover en una hoja de estilo adicional para dispositivos portátiles como:

<link rel="stylesheet" type="text/css" href="handheld.css" media="handheld">

y en handheld.css pon algo así como:

#some_selector:hover {
    background: none;    /* if you are setting a background in the main css file for example */
}

Sin embargo, no estoy seguro si la handheld y la pantalla táctil son completamente iguales, es posible que haya dispositivos que tengan una pantalla táctil y que no estén calificados como dispositivos portátiles.

Editar: parece que no puede detectar dispositivos de pantalla táctil al 100% de manera confiable, también vea esta pregunta .

Answer 2

Parece que este problema se puede resolver sobrescribiendo el estado de desplazamiento de un elemento determinado en la consulta de medios: consulte esta pregunta:

No se ignora el desplazamiento de CSS en los dispositivos de pantalla táctil