web-dev-qa-db-fra.com

Overflow-y: faire défiler sans afficher la barre de défilement dans Chrome

Je génère une liste des organisations figurant dans la partie gauche de cette page: http://www.ihhub.org/member-map/

Cette liste est générée par l’ajout de balises <span> liées à la carte correspondante.

Mon problème est - la barre de défilement n'apparaît pas dans CHROME, mais dans Firefox et Safari.

Des solutions?

METTRE À JOUR:

Ce problème semble être isolé à MAC OS.

SOLUTION:

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}
::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0,0,0,.5);
    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}
13
Graham Cairns

Selon CSS - Débordement: Défilement; - Toujours afficher la barre de défilement verticale? : OSx Lion masque les barres de défilement lorsqu’il n’est pas utilisé pour que l’apparence soit plus "lisse", mais en même temps le problème que vous avez abordé se pose: les gens ne peuvent parfois pas voir si une div a une fonction de défilement ou non.

Correctif CSS:

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}
::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0,0,0,.5);
    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}
23
Graham Cairns

Je vois bien la barre de défilement. Si vous utilisez Mac, vous pouvez vous assurer que les barres de défilement sont toujours affichées.

 System preferences >> general

6
Timo

Ajoutez ceci à votre css

.list::-webkit-scrollbar {
    -webkit-appearance: scrollbartrack-vertical;
}    

ou

.list::-webkit-scrollbar {
   -webkit-appearance: scrollbarthumb-vertical;
} 
4
Timo

J'utilise Windows 8 et la version de Google Chrome est la 48.0.2564.97. Et cela fonctionne parfaitement. Voir dans la zone en surbrillance de l'image.

 enter image description here

0
Ajay Gupta

J'utilise Crome Version 48.0.2564.97 m

Et cela fonctionne très bien ... Changez-le en overflow-y: auto au cas où il n'y aurait pas assez d'éléments, le défilement ne serait pas affiché.

 enter image description here

0
naman