Merida Design Blog

Publicado el | Snippets / ,

Scroll bar personalizado con CSS

Si alguna vez se te ha ocurrido personalizar el scrollbar del navegador en tu página web y no sabes como, resulta que es muy sencillo lograrlo con CSS, el siguiente snippet es un ejemplo de como realizarlo, aunque debo aclarar que solo funciona para navegadores con webkit.

::-webkit-scrollbar{
    width: 5px;
    background: #ddd;
}

::-webkit-scrollbar-thumb {
    background: #444;
    cursor: pointer;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(150,150,150,0.8);
    cursor: pointer;
}

Por cierto, éste código es el que uso para personalizar el scrollbar de éste sitio, espero te sirva.



Publicaciones que pueden interesarte

    Deja un comentario

      tope
    Derechos Reservados, Merida Design 2017
    %d bloggers like this: