Bonjour!
En fouinant un peu, je suis tombée sur ce problème qui est en fait un peu le mien en même temps. Je trouve ce genre de barres de défilement plus esthétique, donc je souhaitais l'insaller sur mon propre forum de test avant de l'appliquer sur le réel forum. C'est là que ça ne fonctionne plus du tout. Tout plante au niveau du javascript je crois bien. En effet, quand je crée une nouvelle feuille, ça fait disparaître mes onglets pour mes catégories, ce qui est bien embêtant parce que j'ai bossé longtemps pour réussir à les avoir. J'ai essayé les trois propositions de Doare, mais ça ne donne rien. En ce moment, j'ai l'option 1 dans mon template overall_header. Voici mon css:

Spoiler:

En fait, je n'ai pas modifié le css du code de base (ici) et j'ai essayé dans un sujet de test avec le code HTML proposé en exemple sur le site juste ici.

Je n'y connais pas grand chose encore au javascript du coup je suppose que le problème vienne de là, mais je n'en suis pas tout à fait certaine... au final, j'ai peut-être fait une erreur stupide sans m'en rendre compte, croyant que je me suis gourrée dans le javascript, ce serait mon genre... En tout cas, merci bien à ceux qui me donneront un coup de main, c'est très apprécié!

Bonsoir.

Citation :

Tout plante au niveau du javascript je crois bien. En effet, quand je crée une nouvelle feuille, ça fait disparaître mes onglets pour mes catégories, ce qui est bien embêtant parce que j'ai bossé longtemps pour réussir à les avoir.

Peut-être qu'il y a une erreur dans le premier code, et/ou les codes entrent en conflit. Il nous faudrait voir ton JS existant, et ce que tu mets dans la nouvelle feuille.

D'ailleurs je ne suis pas arrivée à retrouver les codes nécessaires à l'utilisation du tinyscroller. T'as mis quoi et où ?

Hum... c'est possible que j'aie omis de mettre une partie de code... Mais sinon, mon code pour les onglets c'est ceci:

Spoiler:

Celui des onglets de ma page d'accueil ne semble pas affecté, ni pour la Chatbox sur le côté.

Sinon, pour ce qui est du tinyscroll, je mettais ça dans ma nouvelle feuille.

Code:

    $(function() {
      $('.scrolling').tinyscrollbar();
});

Et c'est ce qui se trouve dans mon template overall_header en fait en ce moment, j'ai baissé les bras après cette tentative.

Je me demandais par contre s'il ne fallait pas autre chose ailleurs. Il me semble que j'ai suivi le tuto à la lettre, mais je trouvais qu'il n'y avait pas grand chose à faire...

En fait, il manque une autre chose du côté Javascript. Sur la page, c'est ce qu'ils présentent comme un fichier à télécharger tout en haut. Il faut faire bien gaffe pour comprendre qu'il faut aussi le prendre, ils ne le rappellent pas vraiment dans le reste de la page. C'est le javascript qui crée la fonction .tinyscrollbar();, donc ça ne peut pas marcher sans.

Je te conseille donc de retourner sur le tuto, cliquer sur le gros bouton pour afficher ce javascript, tout copier, et coller ça dans une nouvelle feuille javascript dans ton panneau d'administration, en l'appliquant sur toutes les pages.

Dans ton JS :

Code:

$('document').ready(function()
  {
      //fonctions appelées une fois le document chargé
  });

Pas de guillemets pour document :

Code:

$(document).ready(function()
  {
      //fonctions appelées une fois le document chargé
  });

Pour que tu saches, c'est équivalent à :

Code:

$(function()
  {
      //fonctions appelées une fois le document chargé
  });

Et au lieu de recréer encore une autre feuille, tu peux juste coller ceci après, avec le reste des fonctions que tu appelles dans ton $(document).ready(); :

Code:

$('.scrolling').tinyscrollbar();

Ahhh je vois! En effet, ça ne pouvait pas vraiment marcher sans ^^

Toutefois, ce code qui est présenté comme étant à télécharger, est-ce que je dois rajouter quelque chose avant de le coller?
Sinon, je ne peux pas le coller dans l'autre feuille de javascript car je ne peux l'appliquer que sur l'index, sinon, ça ne prend pas effet! Du coup, ça va devrait fonctionner quand même dans une nouvelle feuille? Là je l'ai mis à la suite du javascript qui crée la fonction. J'ai du défilement, mais rien sur le côté pour monter et faire descendre (je sais pas si ça défilait avant, je n'avais pas ma souris pour tester avec la roulette >< )

Déjà, merci beaucoup pour les explications, je comprends quelques trucs de plus ^^

Citation :

Toutefois, ce code qui est présenté comme étant à télécharger, est-ce que je dois rajouter quelque chose avant de le coller?

Non.

Citation :

Sinon, je ne peux pas le coller dans l'autre feuille de javascript car je ne peux l'appliquer que sur l'index, sinon, ça ne prend pas effet! Du coup, ça va devrait fonctionner quand même dans une nouvelle feuille?

Je n'ai rien compris.
Edit: Ah, tu parles de l'appel de la fonction tinyscroller ? Ben ok. Là ça marche donc je ne vois pas pourquoi le redéplacer, il est aussi bien dans la même feuille que le bloc "je crée la fonction".

Citation :

J'ai du défilement, mais rien sur le côté pour monter et faire descendre (je sais pas si ça défilait avant, je n'avais pas ma souris pour tester avec la roulette >< )

Déjà, ça veut dire que le code marche. Le reste est une affaire de CSS. L'ascenseur est définir dans le CSS par des background-image. Il faut que tu change les liens de ces images :

Code:

.scrolling .scrollbar{ background: transparent url(../images/bg-scrollbar-track-y.png) no-repeat 0 0; position: relative; background-position: 0 0; float: right; width: 15px; }
.scrolling .track { background: transparent url(../images/bg-scrollbar-trackend-y.png) no-repeat 0 100%; height: 100%; width:13px; position: relative; padding: 0 1px; }
.scrolling .thumb { background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 100%; height: 20px; width: 25px; cursor: pointer; overflow: hidden; position: absolute; top: 0; left: -5px; }
.scrolling .thumb .end { background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 0; overflow: hidden; height: 5px; width: 25px; }

Soit tu gardes les images d'origine, et alors il faut juste que tu rajoutes http://baijs.nl/tinyscrollbar à la place des deux petits points .., soit tu recrées pour avoir ton scroll perso.

Pour info :
bg-scrollbar-track-y fait 15x480, et c'est le corps de la barre de défilement
bg-scrollbar-trackend-y fait 15x11, et c'est l'extrémité basse de la barre de défilement
bg-scrollbar-thumb-y fait 15x480, et c'est l'ascenseur de la barre de défilement

Ohhh je suis bête pour les images alors ><
Du coup, mon problème est résolu, ça fonctionne! Merci infiniment! Maintenant, je crois que je vais aller réviser mes notions de bases! Merci encore! C'est vraiment très gentil à vous!

Hello !
Puisque c'est résolu, je déplace (:
Merci de l'avoir signalé