Cambiar: hover propiedades CSS con JavaScript

Bienvenido a proyecto on line, aquí vas a hallar la resolución a lo que estabas buscando.

Solución:

Pseudoclases como :hover nunca se refiera a un elemento, sino a cualquier elemento que satisfaga las condiciones de la regla de la hoja de estilo. Necesitas editar la regla de la hoja de estilo, añadir una nueva reglao agregue una nueva hoja de estilo que incluya el nuevo :hover regla.

var css = 'table td:hover background-color: #00ff00 ';
var style = document.createElement('style');

if (style.styleSheet) 
    style.styleSheet.cssText = css;
 else 
    style.appendChild(document.createTextNode(css));


document.getElementsByTagName('head')[0].appendChild(style);

No puede cambiar o alterar el actual :hover Selector a través de Javascript. Sin embargo, puede utilizar mouseenter para cambiar el estilo y volver a activar mouseleave (gracias, @Bryan).

Lo que puede hacer es cambiar la clase de su objeto y definir dos clases con diferentes propiedades de desplazamiento. Por ejemplo:

.stategood_enabled:hover   background-color:green
.stategood_enabled         background-color:black
.stategood_disabled:hover  background-color:red
.stategood_disabled        background-color:black

Y esto lo encontré en: Cambiar la clase de un elemento con JavaScript

function changeClass(object,oldClass,newClass)
\s)' + oldClass + '(?!\S)', 'g');
    object.className = object.className.replace( regExp , newClass );
    // add
    //object.className += " "+newClass;


changeClass(myInput.submit,"stategood_disabled"," stategood_enabled");

Nos encantaría que puedieras mostrar esta noticia si te fue de ayuda.

---

---

Utiliza Nuestro Buscador