Double scrollbar [Résolu]

Signaler
-
 zacreur -
Bonjour,

Avant toute chose je suis en autoformation sur html et css depuis 1 mois et demi.

je suis sur un problème embêtant, tout est dans le titre, j'ai une double scrollbar.

J'ai voulu en personnaliser une du coup je me retrouve avec la scrollbar de base plus celle que j'ai faite, mais je n'arrive toujours pas a supprimer celle de base.

j'ai tenté tout les trucs du genre

overflow: hidden
overflow-y: hidden

Mais le soucis c'est que ca me supprime mes 2 scrollbar. Pour même être plus precis, ca me supprime la scrollbar de base, ma scrollbar crée est là mais inutilisable tout comme le scrolling vers le bas.

Merci d'avance a quiconque me trouvera une solution car ca fait des heures que je suis sur ça et là je sature d'idées.
j'ai posté la photo sur Openclassroom si ca interesse.
https://openclassrooms.com/forum/sujet/double-scrollbar

Bonne journée !

2 réponses

Salut,
sans voir votre code (complet) dur de dire quoi que ce soit...
Comment est faite la barre de défilement personnalisée par exemple?
Le code que vous montrez(utilisez les balises de code du forum la prochaine fois ça sera plus clair) étant faux normal qu'il ne fonctionne pas:
Les propriétés CSS s'écrivent sous la forme
nom-de-la-propriété deux-points valeur point-virgule
Donc:
overflow: hidden;
overflow-y: hidden; /*qui ne sert à rien ici d'ailleurs puisque overflow regroupe overflow-x et overflow-y*/


ça ne peut fonctionner sinon.

L'exemple le plus courant de barre personnalisé s'appuie sur des règles spécifiques à différents navigateur et un peu de JavaScript(plus spécifiquement JQuery). Ces règles n'étant pas normalisées il faut indiquer celles spécifiques à chaque navigateur(si elles existent) comme pour webkit en préfixe pour Chrome et Safari:
article complet présentant des plugins(mais assez ancien donc il y a mieux maintenant)
https://www.ipgirl.com/4252/barre-de-defilement-personnalisee-en-css.html
et pour Firefox:
https://developer.mozilla.org/fr/docs/Web/CSS/scrollbar-color
Notez l'indication 'expérimentale' sur le site officiel de Mozilla.

La meilleure solution est donc selon moi de faire soit votre propre barre de défilement cross-browser(ou utiliser un script qui fait la même chose) avec CSS en un peu de JavaScript ou alors de ne rien faire et d'améliorer le design.
En effet utiliser un script compliqué pour un résultat expérimental(et voué à changer avec l'évolution du web) me paraît pas toujours une bonne idée. Surtout si vous ne connaissez pas encore la programmation ce sera compliqué et vous commencerez par faire des choses plutôt douteuses(en tout cas assez complexe pour obtenir un résultat plutôt foireux) plutôt que passer par des méthodes et façons de faire plus propre et basé sur de bonnes habitudes.
La personnalisation des barres de défilement effectivement ce n'est pas l'idéal pour l'instant(côté CSS) mais ça vient aussi du fait que ça permet aussi à l'utiliser d'identifier clairement un outil de navigation, donc c'est plutôt à réserver à des cas très spécifiques pour ne pas perdre d'ergonomie et faire en sorte que utilisateur sache directement ce sur quoi il doit agir pour consulter le contenu du site.
Bonjour, merci pour votre réponse.
comme je l'avais dit j'ai aussi envoyé ma question sur Openclassroom.
La personne qui m'a répondu m'a fait la même remarque que vous c'est à dire de voir le code et il m'a proposé d'utiliser Js fiddle.
Et c'est en utilisant ça que le logiciel m'a fait remarquer certaine de mes erreurs j'ai donc procédé à les corriger et c'est ainsi que mon problème fut reglé.

quoiqu'il arrive merci encore pour votre réponse.
Bien cordialment !