addClass / removeClass / hasClass / toggleClass

Asociar una clase

$("#elemento").addClass("clase");

Desasociar clase

$("#elemento").removeClass("clase");

Cambiar clase, si está, quitarlo, si no está, ponerlo

$("#elemento").toggleClass("clase");

¿Tiene clase?

if($("#elemento").hasClass("clase")){alert("exito")}
Métodos addClass

Ejercicio - animate.css

Usando addClass, hacer que al pulsar un botón este coja los estilos necesarios y suministrados por la librería animate.css para que se produzca la animación correspondiente

Para que funcione, habrá que añadir el class animated y el class correspondiente a la animación que queremos emplear y que podemos consultar en animate.css.

Si queremos que pasado un tiempo se elimine el class, usaremos la función timeOut

setTimeout( function(){
	$("#rojo").removeClass('animated bounce');
}, 2000);

Si queremos que el class se elimine cuando la animación ha concluído, usaremos:

$("#rojo").one("animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd", function(){ 
	$("#rojo").removeClass("animated bounce");
});

Ejercicio menú hamburguer

if($("#elemento").hasClass("clase")){...}
icono de mandar un mail¡Contacta conmigo!
contacta conmigoPablo Monteserín

¡Hola! ¿En qué puedo ayudarte?