Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save shishirsharma/9c225df7983f4a0042b4804447a4d98c to your computer and use it in GitHub Desktop.
Save shishirsharma/9c225df7983f4a0042b4804447a4d98c to your computer and use it in GitHub Desktop.
CSS : Chrome custom scrollbar
/*http://support.google.com/chrome/?hl=en*/
::-webkit-scrollbar {
height: 16px !important;
overflow: visible !important;
width: 16px !important;
}
::-webkit-scrollbar-thumb {
background: -webkit-linear-gradient(left, rgba(198,198,198,1) 0%,rgba(220,220,220,1) 100%) !important;
background-clip: padding-box !important;
border: 2px solid transparent !important;
border-image: initial !important;
min-height: 28px !important;
padding: 100px 0px 0px !important;
/*box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 0px inset, rgba(0, 0, 0, 0.0666667) 0px -1px 0px inset !important;*/
}
/* :window-inactive inspired by cssTricks */
::-webkit-scrollbar-thumb:hover {
background: -webkit-linear-gradient(left, rgba(158,158,158,1) 0%,rgba(180,180,180,1) 100%) !important;
background-clip: padding-box !important;
}
/* :window-inactive inspired by cssTricks */
::-webkit-scrollbar-thumb:window-inactive {
background: -webkit-linear-gradient(left, rgba(58,58,58,1) 0%,rgba(80,80,80,1) 100%) !important;
background-clip: padding-box !important;
}
::-webkit-scrollbar-button {
height: 0px !important;
width: 0px !important;
}
::-webkit-scrollbar-track {
/*background: -webkit-linear-gradient(left, rgba(224,224,224,1) 0%,rgba(200,200,200,1) 100%) !important;*/
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAAAAABVicqIAAAACXZwQWcAAABkAAAAZACHJl7mAAAASUlEQVRo3u3PQQEAIAzDQOoE/6bAyaaiv0sUXN799TOnX0hISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhIqi0mjfaIwOmF7QAAAABJRU5ErkJggg==) repeat !important;
/*background-clip: padding-box !important;*/
/*border: 2px solid white !important;*/
/*border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAAAAABVicqIAAAACXZwQWcAAABkAAAAZACHJl7mAAAASUlEQVRo3u3PQQEAIAzDQOoE/6bAyaaiv0sUXN799TOnX0hISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhIqi0mjfaIwOmF7QAAAABJRU5ErkJggg==) 3 repeat!important;*/
/*border-image: initial !important;*/
box-shadow: inset 1px 0px 5px -2px rgba(0,0,0,0.3);
}
::-webkit-scrollbar-corner {
background: transparent !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment