personnalisée scrollbar CSS WebKit ne fonctionne pas dans Firefox brwoser

Question

Voici mon violon: SCROLLBAR

Exécuter le violon dans les deux navigateurs Chrome et Firefox, cliquez sur le bouton « Toggle » pour voir CSS personnalisé ne pas être appliquée pour la barre de défilement Navigateur Firefox.

Y at-il un moyen que je peux afficher la barre de défilement personnalisée dans tous les navigateurs?

::-webkit-scrollbar { 
    width: 8px; 
} 
/* Track */ 
::-webkit-scrollbar-track { 
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); 
    -webkit-border-radius: 100px; 
    border-radius: 100px; 
} 
/* Handle */ 
::-webkit-scrollbar-thumb { 
    -webkit-border-radius: 100px; 
    border-radius: 100px; 
    background: #c1bdbe; 
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5); 
} 
::-webkit-scrollbar-thumb:window-inactive { 
    background: #555D69; 
} 

Toute aide serait grandement appréciée.

Merci.

Answer 1

Firefox ne supporte pas encore les barres de défilement personnalisées, donc il n'y a aucun moyen de le faire en CSS. https://developer.mozilla.org/en-US/docs/Web/CSS/::-webkit-scrollbar

Vous devez utiliser JavaScript pour avoir un style global sur tous les navigateurs.