Scrollbar Padrão Fofa

Olá! Como estão? Imagino que apreensivos por causa da temida SEGUNDA FEIRA ;___; rsrsrs...
Bem, hoje lhes trouxe um tutorial de personalização da scrollbar diferente daquele que mostrei neste post aqui, o qual usava anteriormente e troquei pelo do post de hoje.
A scrollbar desse código fica semelhante a padrão, que todo mundo já conhece e que aparece quando não há personalização; ela tem os dois quadradinhos em que se clica para deslizar para cima ou para baixo, e a barra normal, só que por meio de CSS você a deixa do jeito que desejar. Funciona no Chrome.
Vamos lá!
Adicione o código acima de ]]></b:skin> alterando conforme descrito abaixo (cores, altura e largura).
::-webkit-scrollbar {
width:0px;/**largura**/
height:0px;/**altura**/
}
::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment  {
width:0px;/**largura**/
height:0px;/**altura**/
display:block;
background:#000;/**cor dos quadradinhos**/
border:1px solid #000; /**cor e estilo da borda dos quadradinhos**/
}
::-webkit-scrollbar-track-piece  {
background-color:#000;/**cor de fundo**/
}
::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
background-color:#000;/**cor da barra scrollbar**/
border:1px solid #000;/**cor e estilo da borda da barra scrollbar**/
} 

Não testei se pode substituir as cores por imagens, mas imagino que sim. Caso queiram testar, troque background: #000; por background: url(URL DA IMAGEM);
As alturas e larguras devem ter o mesmo tamanho e se referem tanto aos quadradinhos quanto a scrollbar.
Sugestões de cores? Clique aqui.
Espero que gostem e beijus ;3






Postar um comentário

5 Comentários

  1. Anônimo24 fevereiro

    Nossa,eu me apaixonei perdidamente pelo seu blog!É muito,muito lindo..já tô seguindo!
    Dá uma passadinha no meu,e se gostar,segue (mas só se você quiser,é claro!)
    http://confissoesdeumasonhadora.blogspot.com.br

    Xoxo! *-*

    ResponderExcluir
  2. Oi lindo reino, vim deixar um selinho pra você! Espero que aceite! Beijos
    http://otome-solitaria.blogspot.com.br/2013/02/selinho-musical.html

    ResponderExcluir
  3. Muito obrigada!!! Aceito o selinho Yareindy e visito sim Valéria. Sejam sempre bem vindas!
    Beijus ;3

    ResponderExcluir
  4. ajudou e muito Roberta, obrigada *p*

    ResponderExcluir
    Respostas
    1. Que bom!!! Fico super contente em saber disso :3
      Beijus e obrigada!!!

      Excluir

Muito obrigada por seu comentário e por sua presença! Ambos são super importantes para mim.

Apenas peço que:
- Comente a vontade, dê sua opinião, faça críticas, esclareça suas dúvidas e dê suas sugestões sobre o assunto referente às postagens;
- Use um vocabulário livre para todas as idades;
- Não ofenda ninguém em hipótese alguma.

Os comentários são moderados e não são permitidos comentários de pessoas que não se identifiquem. Algumas dúvidas podem ser previamente esclarecidas na F.A.Q, assim como créditos e outras coisas.

Por favor, entrem em contato por meio das redes sociais também para dúvidas, sugestões, pedidos ou outros:
Facebook - Twitter - Deviantart

up