jquery - elegantthemes - plantilla divi wordpress gratis

Eliminar/Añadir el control deslizante después de alternar Jquery

Question

Tengo este css:

.disable {
properties
}
.comment_action:hover {
properties
}

Tengo este jQuery:

//comment button index disable
$("#mydiv").toggle(function() {
$(this).find(".comment_action").addClass(''disable'');
},
function(){
$(this).find(".comment_action").removeClass(''disable'');
});

El problema para mí es que cuando hago clic en .comment_action: el elemento emergente no desaparece ni se elimina . Quiero que si lo hago, haga clic en la clase .comment_action: desplace el cursor y, si hago clic nuevamente, aparece .comment_action: hover.

Answer 1

Le está diciendo a su navegador que agregue efectos de .comment_action a .comment_action . Esto es lo que sucederá con todos los elementos de esa clase, independientemente de que tenga cualquier otra clase, como .disable .

Solución: agregue las propiedades: hover a una nueva clase .enable . En lugar de simplemente eliminar y agregar .disable , también agrega y elimina .enable .

.disable {
properties
}
.enable:hover {
properties
}

Answer 2

Necesitará una !important añadida a las propiedades que desea anular en :hover psuedo-selector ...

Porque :hover .disabled tiene prioridad, incluso si se aplica .disabled .

También su javascript debería estar llamando find con .comment_action lugar de comment_action

Ver ejemplo de trabajo: http://jsfiddle.net/TN4rh/11/

Answer 3

Una mejor solución sería alternar la clase. Lo que estás tratando de hacer se puede hacer en una línea .

$("#mydiv").click(function() {
$(this).find(".comment_action").toggleClass(''disable'');
});

Manifestación

:)