CSS / jquery si() css effet

Pas sûr de savoir pourquoi cela ne fonctionne pas...

J'ai plusieurs DIVs avec une classe de .rightColumnButton. Quelques-uns d'entre eux ont une hauteur de 30px:

.rightColumnButton{
height:30px;
width:206px;
margin-top:20px;
}

Je veux changer le margin-top de 10px si elles ont une hauteur de 30px:

$(function(){

if($( '.rightColumnButton' ).css("height") == "30"){
    $(this).animate({marginTop: "10px"}, 500);


    }    
} );

Ne fonctionne pas pour moi.

InformationsquelleAutor Jared | 2010-01-04

3

À l'aide de css('height') renvoie également à l'unité, qui est généralement "px". Donc dans ce cas, vous êtes en comparant '30px' == '30'. Utiliser le height() méthode qui renvoie une valeur numérique et de la comparer à un entier.

Aussi, vous ne spécifiez pas ce que l'objet que vous souhaitez animer, en tant que l'élément n'est pas se "portés" à l'intérieur de la if clause. Utiliser le each() méthode sur l'élément pour créer une fermeture:
```
$(function(){
    $('.rightColumnButton').each(function() {
        if($(this).height() == 30) {
            $(this).animate({marginTop: "10px"}, 500);
        }    
    });
});
```
MODIFIER

Au lieu de l'écrire dans les commentaires, je pensais que je voudrais éclaircir moi-même ici. Je suppose que votre point est d'animer tous les éléments qui ont une hauteur de 30px. Dans votre post original, vous avez eu ce:
```
if($( '.rightColumnButton' ).css("height") == "30"){
```
Qui ne sélectionner tout".rightColumnButtons' d'accord, mais lorsque vous utilisez le css("height") appel, vous obtenez seulement la hauteur du premier élément. Si votre code a bien travaillé, il aurait animé tous les divs que si la première div avait une hauteur de 30px.

C'est là que le each() méthode est très pratique. Il parcourt tous les éléments de la sélection et compare les hauteurs indépendamment les uns des autres et anime si nécessaire.
- Merci pour l'info, votre info étais sur place, mais j'ai plusieurs divs, et je pense que ce ne contrôle que le premier. Les trois premiers ont une hauteur de 110px, j'en ai besoin pour vérifier tous les d'entre eux.
- Le each méthode passe en boucle sur tous les éléments qui ont la classe rightColumnButton', de sorte qu'il vérifie tous les d'entre eux.
- Merci! Juste besoin de supprimer le premier "si"
- Oh, vous avez raison, mon mauvais. Fixe.
InformationsquelleAutor Tatu Ulmanen
1

la css() méthode retourne une chaîne de caractères avec des unités, dans votre cas "30px';

Donc vous devez vérifier pour
```
$('.rightColumnButton').css("height") == "30px" 
```
ou de l'utilisation de la hauteur() fonction:
```
$('.rightColumnButton').height() == 30
```
Vous devez également définir this avant d'animer.
```
var col = $('.rightColumnButton');
if (col.height() == 30) {
    col.animate({marginTop: "10px"});
}
```
InformationsquelleAutor David Hellsing

this n'est pas spécifié

$(function(){
    $( '.rightColumnButton' ).each(function(){
        if($(this).css("height") == "30"){
            $(this).animate({marginTop: "10px"}, 500);
        }
    }
    );
});

devrait être each au lieu de foreach 🙂
c'est vrai, mon mauvais. fixe maintenant.

InformationsquelleAutor metrobalderas

0

Comment à ce sujet ?
```
$(function(){
    if($( '.rightColumnButton' ).css("height") == "30px"){
      $(this).animate({marginTop: "10px"}, 500);
    }    
} );
```
Si cela ne fonctionne pas, essayez de mettre une alerte pour le contenu de :
```
$('.rightColumnButton').css("height")
```
... et coller le résultat ici.
- Je vois une partie de mon problème. Les trois premières Divisions .rightColumnButton ont une hauteur de 110px, les autres ont une hauteur de 30px. C'est seulement la vérification de la première, j'ai besoin de boucle. Merci pour la suggestion sur le qui-vive, il retourne 110px.
- Toutes les suggestions sur l'exécution d'une boucle à travers tous les .rightColumnButton ?
InformationsquelleAutor marcgg
0

Je pense que le problème est que le $('rightColumnButton').css... retourne une collection de valeurs, et votre si est comaring qu'à 30.

Essayer quelque chose comme ceci à la place:
```
$("rightColumnButton").each(function (i) {
    if (this.height == 30) 
        $(this).animate({marginTop: "10px"}, 500);
}
```
InformationsquelleAutor Ed Schembor

Vous devez vous connecter pour publier un commentaire.