pricing - toggle javascript

¿Cómo desencadenar CSS "hover state" usando Javascript?

Question

Esta pregunta ya tiene una respuesta aquí:

• ¿Cómo simulo un mouseover en JavaScript puro que activa el CSS ": hover"? 4 respuestas

El "estado suspendido" de CSS se activará cuando el usuario se desplace sobre un elemento:

<style>
.element{
}
.element:hover{
background-color:red;
}
</style>

¿Cómo podemos configurar el elemento en "estado suspendido" usando Javascript?

¿Es posible?

Answer 1

Probablemente sea mejor que dupliques los estilos: hover en otra clase y luego simplemente agregue ese nombre de clase al elemento cuando quiera que cambien permanentemente. Las pseudo-clases son "pseudo" por una razón.

Answer 2

Si pudieras aceptar usando :focus lugar de hover, puedes usar:

var links = document.getElementsByTagName(''a'');
links[0].focus();

Demostración de JS Fiddle .

O

var linkToFocus = document.getElementById(''link'');
linkToFocus.focus();

Demostración de JS Fiddle .

Este enfoque, obviamente, requiere adaptar su CSS para incluir el estilo a: a:focus :

a:link, a:visited {
background-color: #fff;
}
a:hover, a:focus, a:active {
background-color: #f00;
}