Code pour changement fond champ sous avatar

[photoclic]

Bonjour à tous,

Je fais suite à cette demande résolue par chattigre que je remercie à nouveau :
https://forum.forumactif.com/t406684-aide-pour-couleur-arriere-plan-dans-un-js#3390179

Je cherche à changer de la même manière le fond d'une ligne du profil sous l'avatar.
il s'agit cette fois de la ligne "Vote reçu" dont le fond du nombre devrait changer de couleur en fonction de sa valeur.

J'utilise ce code, mais le changement de couleur du fond ne s'applique pas:

Code:


$(function(){
$('.postprofile').each(function(){
var voteu=$(this).find('span.M14_blocSpan.field_votes-re__00e7us').find('.value').text();
$('span.M14_blocSpan.field_votes-re__00e7us span.value').addClass('nbrevoterec');
   if((parseInt(voteu,10)) < 10) {
        $(".nbrevoterec").css({"background-color":"rgb(255, 187, 53)","width":"20px"});
                        }
        else if((parseInt(voteu,10)) < 200) {
        $(".nbrevoterec").css({"background-color":"rgb(40, 187, 53)","width":"20px"});
                        }
        else {
        $(".nbrevoterec").css({"background-color":"rgb(255, 187, 53)","width":"20px"});
                        }               
   });});


Merci pour votre aide.

[chattigre]

Bonjour,

Quels sont les paliers de coloration que tu souhaites ? Parce que il y a une incohérence dans les paliers du script actuellement

[photoclic]

Bonjour chattigre,

Merci pour la prise en compte du sujet.

Alors pour les paliers, j'avais en tête 3 couleurs:
0 à 10: couleur rgb(255, 187, 53)
10 à 200: couleur rgb(40, 187, 53)
au dela: couleur rgb(32, 174, 200)

Oui, dans mon script, j'avais oublié de changer la 3ième couleur et les largeurs aussi

Code:


   if((parseInt(voteu,10)) < 10) {
        $(".nbrevoterec").css({"background-color":"rgb(255, 187, 53)","width":"20px"});
                        }
        else if((parseInt(voteu,10)) < 200) {
        $(".nbrevoterec").css({"background-color":"rgb(40, 187, 53)","width":"50px"});
                        }
        else {
        $(".nbrevoterec").css({"background-color":"rgb(32, 174, 200)","width":"90px"});

[chattigre]

Ceci semble fonctionner :
- Il fallait bien restreindre le palier intermédiaire : < 200 ET >= 10, sinon le premier passe à la trappe
- On n'agit pas sur tous les .nbvoterec mais sur celui que l'on trouve dans le .postprofile que l'on est en train de traiter ( avec $('.postprofile').each(function(){ ) donc on utilise quelque chose sous la forme $(this).find("selecteur") pour rechercher selecteur dans l'élément (ici this qui est la cible courante du .each()) et non dans la page.

Code:

 
$(function(){
    $('.postprofile').each(function(){
        var voteu=$(this).find('span.M14_blocSpan.field_votes-re__00e7us').find('.value').text();
        $('span.M14_blocSpan.field_votes-re__00e7us span.value').addClass('nbrevoterec');
        if((parseInt(voteu,10)) < 10) {
            $(this).find(".nbrevoterec").css({"background-color":"rgb(255, 187, 53)","width":"20px"});
        }
        else if(((parseInt(voteu,10)) >= 10) && ((parseInt(voteu,10)) < 200)) {
            $(this).find(".nbrevoterec").css({"background-color":"rgb(40, 187, 53)","width":"20px"});
        }
        else {
            $(this).find(".nbrevoterec").css({"background-color":"rgb(32, 174, 200)","width":"20px"});
        }             
    });});

Bonne journée

[photoclic]

Encore un grand merci chattigre pour ton aide.

C'est tout bon.

Je viens enfin de mieux comprendre grâce à tes explications la façon de cibler un élément avec $(this).
J'ai remis les bons width aussi.

Je passe en résolu.