Code pour changement fond champ sous avatar

2 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Code pour changement fond champ sous avatar

Message par photoclic Dim 20 Fév 2022 - 22:44

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.
photoclic

photoclic
Membre habitué

Masculin
Messages : 1160
Inscrit(e) le : 20/11/2015

Voir le profil de l'utilisateur http://photoclic.forum-pro.fr/
photoclic a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour changement fond champ sous avatar

Message par chattigre Lun 21 Fév 2022 - 9:58

Bonjour,

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

chattigre
Membre habitué

Masculin
Messages : 1930
Inscrit(e) le : 17/04/2019

Voir le profil de l'utilisateur https://test1-chattigre.forumactif.fr
chattigre a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour changement fond champ sous avatar

Message par photoclic Lun 21 Fév 2022 - 10:27

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 Embarassed
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"});
photoclic

photoclic
Membre habitué

Masculin
Messages : 1160
Inscrit(e) le : 20/11/2015

Voir le profil de l'utilisateur http://photoclic.forum-pro.fr/
photoclic a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour changement fond champ sous avatar

Message par chattigre Lun 21 Fév 2022 - 10:48

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
chattigre

chattigre
Membre habitué

Masculin
Messages : 1930
Inscrit(e) le : 17/04/2019

Voir le profil de l'utilisateur https://test1-chattigre.forumactif.fr
chattigre a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour changement fond champ sous avatar

Message par photoclic Lun 21 Fév 2022 - 11:05

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.
photoclic

photoclic
Membre habitué

Masculin
Messages : 1160
Inscrit(e) le : 20/11/2015

Voir le profil de l'utilisateur http://photoclic.forum-pro.fr/
photoclic a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum