Vous pouvez utiliser la fonction hasClass() ou la fonction is().
La construction d'un sélecteur est une opération coûteuse, on accélère le traitement du code en placant l'objet jQuery dans une variable.
Vous pouvez utiliser la fonction hasClass() ou la fonction is().
La construction d'un sélecteur est une opération coûteuse, on accélère le traitement du code en placant l'objet jQuery dans une variable.
Si l'élément d'ID "monID" a la classe "maClasse" alors le montrer en passant la propriété CSS display de "none" à "block" :
var jObj = $( "#monID" );
if ( jObj.is( ".maClasse" ) ){
jObj.show();
}
Considérons une division d'ID "monID" pouvant avoir plusieurs classes. Si l'élément a la classe "maClasse" alors on colore le texte en rouge et on anime la division en la déplaçant vers la droite de 100px puis en la déplaçant vers la gauche de 100px.
Nota bene : pour animer un élément du DOM, sa position CSS doit être "relative", "fixed" ou "absolute".
Code CSS :
.maClasse { position: relative; width: 100px; height: 100px; margin-left: 100px; border: 1px solid red; }
Code HTML :
<div id="monID" class="maClasse"></div>
Code JS :
var jObj = $( "#monID" );
if ( jObj.hasClass( "maClasse" ) ){
jObj
.css( "color", "red" )
.animate( { "left" : "+=100px" }, "slow" )
.animate( { "left" : "-=100px" }, "slow" );
}
La durée de l'animation est réglée par le paramètre "slow" qui pourrait être remplacé par une
durée exprimée en millisecondes, par exemple : .animate( { "left" : "-=100px" }, 3000 );