Bien le bonjour ! Je suis actuellement en train de modifier la structure d'un forum et j'aurais aimé pouvoir modifier le css d'une classe dans une page en fonction de son titre. Est-ce possible ? C'est le seul moyen que j'ai trouvé pour, vu le fonctionnement du forum et sa structure (assez chaotique), cacher et afficher différents texte en fonction de la page visitée.
Pour mettre en exemple :
Sur toutes les pages du forum est affiché une zone d'aide et de précisions, toujours au même endroit. Dans cette zone, plusieurs div aux classes différentes contenant différents textes sont méticuleusement cachés (display: none;) pour ne pas être visibles. Au chargement de la page (instantanément donc), un code affiche un div spécifique (display: block;) en fonction du tire de la page (si le titre est "titre1" alors le div "aide1" contenant le texte "texte1" sera affiché.
Je crois qu'il est possible d'y parvenir avec quelque chose dans ce principe là :
mais comme mes connaissances en Javascript ne s'étendent pas au-delà du changement de valeurs d'un code déjà tout fait, je ne sais pas comment créer les conditions ni comment faire en sorte d'interagir avec le titre de la page (je ne sais même pas si c'est possible, en fait).
Quelqu'un serait en mesure de m'indiquer la façon de faire (sans forcément me sommer d'aller apprendre le JS) ou m'indiquer un tutoriel déjà existant qui me permettrait d'apprendre à l'intégrer sur mon forum ?
Merci d'avance !
EDIT :
À force d'essais, je suis parvenu à un résultat avec ceci... mais j'ai comme l'impression que de devoir reprendre le même code pour toutes les pages de mon forum me prendra au moins 100 ans. Est-ce possible de faire la même chose mais plus facilement ?
Modifié par Ptolam (10 Dec 2012 - 04:51)
Pour mettre en exemple :
Sur toutes les pages du forum est affiché une zone d'aide et de précisions, toujours au même endroit. Dans cette zone, plusieurs div aux classes différentes contenant différents textes sont méticuleusement cachés (display: none;) pour ne pas être visibles. Au chargement de la page (instantanément donc), un code affiche un div spécifique (display: block;) en fonction du tire de la page (si le titre est "titre1" alors le div "aide1" contenant le texte "texte1" sera affiché.
<div class="precisions">
<div class="aide1">texte 1</div>
<div class="aide2">texte 2</div>
<div class="aide3">texte 3</div>
<div class="aide4">texte 4</div>
<div class="aide5">texte 5</div>
etc.
</div>
Je crois qu'il est possible d'y parvenir avec quelque chose dans ce principe là :
SI le titre de la page est "titre1" > .find('.aide1').css('display', 'block');
SI le titre de la page est "titre2" > .find('.aide2').css('display', 'block');
etc.
mais comme mes connaissances en Javascript ne s'étendent pas au-delà du changement de valeurs d'un code déjà tout fait, je ne sais pas comment créer les conditions ni comment faire en sorte d'interagir avec le titre de la page (je ne sais même pas si c'est possible, en fait).
Quelqu'un serait en mesure de m'indiquer la façon de faire (sans forcément me sommer d'aller apprendre le JS) ou m'indiquer un tutoriel déjà existant qui me permettrait d'apprendre à l'intégrer sur mon forum ?
Merci d'avance !
EDIT :
var titre = window.location.href;
var f =
[
'preface',
'gestion',
'glasgow-royal-lunatic-asylum',
'le-sanctuaire-des-malheurs'
];
$(function() {
if (titre.indexOf(f[0])>=0) {
$('.preface').removeClass().addClass('.displayed');
} if (titre.indexOf(f[1])>=0) {
$('.gestion').removeClass().addClass('.displayed');
} if (titre.indexOf(f[2])>=0) {
$('.asile').removeClass().addClass('.displayed');
} if (titre.indexOf(f[3])>=0) {
$('.sanctuaire').removeClass().addClass('.displayed');
}
});
</script>
À force d'essais, je suis parvenu à un résultat avec ceci... mais j'ai comme l'impression que de devoir reprendre le même code pour toutes les pages de mon forum me prendra au moins 100 ans. Est-ce possible de faire la même chose mais plus facilement ?
Modifié par Ptolam (10 Dec 2012 - 04:51)