Pseudo bicolore
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Pseudo bicolore
Bonjour,
Cela fait plusieurs jours que je cherche en vain à afficher un pseudo particulier en bicolore et j'ai beau avoir fouillé les tutos et les questions/réponses je n'ai pas trouvé de solution. J'ai donc décidé de m'inscrire afin de pouvoir exposer mon problème.
J'ai trouvé comment faire référence à un pseudo particulier en CSS sur cette page
J'ai donc, dans un premier temps ajouté ceci dans la feuille CSS :
Mais d'une part cela ne fonctionne pas dans mon CSS (le pseudo en question fait parti d'un groupe) et d'autre part (à ma connaissance) on ne peut changer la couleur que de l'ensemble en CSS (donc pas de bicolore)
Je me suis donc tourné vers le JavaScript et la fonction .replace en me basant sur ce post mais ça ne fonctionne pas non plus, ceci dit je ne connais pas le JS et ma fonction est probablement erronée.
Y aurait-il une âme charitable capable de me donner un coup de main ?
Merci d'avance
Cela fait plusieurs jours que je cherche en vain à afficher un pseudo particulier en bicolore et j'ai beau avoir fouillé les tutos et les questions/réponses je n'ai pas trouvé de solution. J'ai donc décidé de m'inscrire afin de pouvoir exposer mon problème.
J'ai trouvé comment faire référence à un pseudo particulier en CSS sur cette page
J'ai donc, dans un premier temps ajouté ceci dans la feuille CSS :
- Spoiler:
- Code:
a[href='/u12'] {
color : #FFFFFF !important;
font-weight : normal !important;
}
Mais d'une part cela ne fonctionne pas dans mon CSS (le pseudo en question fait parti d'un groupe) et d'autre part (à ma connaissance) on ne peut changer la couleur que de l'ensemble en CSS (donc pas de bicolore)
Je me suis donc tourné vers le JavaScript et la fonction .replace en me basant sur ce post mais ça ne fonctionne pas non plus, ceci dit je ne connais pas le JS et ma fonction est probablement erronée.
- Spoiler:
- Code:
$(function(){
var pseudo_a_modif = $("a[href='/u12']");
var reg = new RegExp( "(Caro)(line)", "g");
$(pseudo_a_modif).html($(pseudo_a_modif).html().replace( reg, "<SPAN style='color=#000000'>$1</SPAN><SPAN style='color=#ffffff'>$2</SPAN>" ) ;
});
Y aurait-il une âme charitable capable de me donner un coup de main ?
Merci d'avance
Dernière édition par Flibustier le Dim 29 Jan 2012 - 18:33, édité 1 fois
Re: Pseudo bicolore
Bonjour,
Vous pouvez ajouter ce JS :
Et dans votre CSS :
Et voilà le résultat :
Vous pouvez ajouter ce JS :
- Code:
$(function() {
var thispseudo = $('.postprofile a[href="/u12"]').text();
var pseudofirst = '<span class="firstpart">'+ thispseudo.substr(0, 4) +'</span>';
var pseudosecond = '<span class="secondpart">'+ thispseudo.substr(4, 8) +'</span>';
$('.postprofile strong a[href="/u12"]').html(pseudofirst + pseudosecond);
});
Et dans votre CSS :
- Code:
.firstpart { color: red; }
.secondpart { color: orange;}
Et voilà le résultat :
Re: Pseudo bicolore
Merci beaucoup Threax
J'ai légèrement modifié ton script et ton CSS afin que les changements interviennent partout où le pseudo est affiché. Voici mes codes :
JS :
CSS :
Problème :
- Dans le JS le "strong" de la dernière ligne étant supprimé l'image de l'avatar est également remplacée
- Le display : inline est nécessaire sinon les 2 parties se trouvent sur 2 lignes différentes dans la colonne "derniers messages" des tables "catégories"). Avec ce inline il reste toutefois un espace entre les 2 parties du pseudo que je n'arrive pas à retirer
Je suis en train de bidouiller pour arriver à résoudre ces 2 problèmes (avec l'aide d'un ami ^^)
En remettant le "strong", l'image de l'avatar revient bien mais de nouveau seul le pseudo dans le postprofile est affecté (ainsi que dans la colonne des derniers messages) Existe-t-il un moyen de mettre un exclusif ? C'est à dire tous les liens sauf les images ?
Pour l'autre problème j'ai tenté avec un white-space:nowrap sur le dd.lastpost span mais ça ne fonctionne pas sur le pseudo du posteur et ça agit par contre sur le titre du sujet du dernier post ^^
Une idée ?
J'ai légèrement modifié ton script et ton CSS afin que les changements interviennent partout où le pseudo est affiché. Voici mes codes :
JS :
- Code:
$(function() {
var thispseudo = $('a[href="/u12"]').text();
var pseudofirst = '<span class="firstpart">'+ thispseudo.substr(0, 4) +'</span>';
var pseudosecond = '<span class="secondpart">'+ thispseudo.substr(4, 4) +'</span>';
$('a[href="/u12"]').html(pseudofirst + pseudosecond);
});
CSS :
- Code:
.firstpart {
color: black;
font-weight : bold;
display : inline !important;
}
.secondpart {
color: white;
font-weight : bold;
display : inline !important;
}
Problème :
- Dans le JS le "strong" de la dernière ligne étant supprimé l'image de l'avatar est également remplacée
- Le display : inline est nécessaire sinon les 2 parties se trouvent sur 2 lignes différentes dans la colonne "derniers messages" des tables "catégories"). Avec ce inline il reste toutefois un espace entre les 2 parties du pseudo que je n'arrive pas à retirer
Je suis en train de bidouiller pour arriver à résoudre ces 2 problèmes (avec l'aide d'un ami ^^)
En remettant le "strong", l'image de l'avatar revient bien mais de nouveau seul le pseudo dans le postprofile est affecté (ainsi que dans la colonne des derniers messages) Existe-t-il un moyen de mettre un exclusif ? C'est à dire tous les liens sauf les images ?
Pour l'autre problème j'ai tenté avec un white-space:nowrap sur le dd.lastpost span mais ça ne fonctionne pas sur le pseudo du posteur et ça agit par contre sur le titre du sujet du dernier post ^^
Une idée ?
Dernière édition par Flibustier le Dim 29 Jan 2012 - 18:39, édité 1 fois
Re: Pseudo bicolore
Bon après quelques bidouillage voici le nouveau code JS :
Tout les endroits où figure le lien (et donc le pseudo) sont bien affectés sauf l'image de l'avatar
mais j'ai toujours le problème avec ce maudit espace, il semblerait qu'une nouvelle cellule soit automatiquement créée en séparant le pseudo en 2 span
Si quelqu'un avait une idée pour que cela n'affecte pas la mise en forme...
Edit : Problème résolu avec ce CSS
Sujet à verrouiller
PS : Un grand merci à Treax pour son aide ainsi qu'à Brendhal qui à modifié les codes JS et CSS d'origine et me les a envoyer par mail
- Code:
$(function() {
var thispseudo = $('a[href="/u12"]').text();
var pseudofirst = '<span class="firstpart">'+ thispseudo.substr(0, 4) +'</span>';
var pseudosecond = '<span class="secondpart">'+ thispseudo.substr(4, 4) +'</span>';
$('.postprofile strong a[href="/u12"]').html(pseudofirst + pseudosecond);
$('p a[href="/u12"]').html(pseudofirst + pseudosecond);
$('.module a[href="/u12"]').html(pseudofirst + pseudosecond);
});
$('.dd a[href="/u12"]').html(pseudofirst + pseudosecond);
Tout les endroits où figure le lien (et donc le pseudo) sont bien affectés sauf l'image de l'avatar
mais j'ai toujours le problème avec ce maudit espace, il semblerait qu'une nouvelle cellule soit automatiquement créée en séparant le pseudo en 2 span
Si quelqu'un avait une idée pour que cela n'affecte pas la mise en forme...
Edit : Problème résolu avec ce CSS
- Code:
.firstpart {
color: black;
font-weight : bold;
display : inline !important;
}
.secondpart {
color: white;
font-weight : bold;
padding-left : 0px !important;
display : inline !important;
}
Sujet à verrouiller
PS : Un grand merci à Treax pour son aide ainsi qu'à Brendhal qui à modifié les codes JS et CSS d'origine et me les a envoyer par mail
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum