Avisos do blog: Voltamos com o blog!
Participem do game, o prêmio é ótimo!
Novo layout em breve!
Votem na enquete na barra lateral, por favor.

20 de fevereiro de 2013

Tutorial: Barra de Rolagem Personalizada

Awnt que fofo! 
Oi gente, tudo bom? Resolvi agora postar mais tutoriais, já que vocês pediram nas enquetes, e hoje vim com um de barra de rolagem personalizada (vai ficar igual a esse blog nosso aqui), e estou com uma pressa, então vamos lá!


Créditos: Quinze para a meia Noite

No painel do blogger, clique no nome do seu blog, depois, clique em "Modelo" no menu vertical que aparece no lado esquerdo da tela. Clique no botão "Editar HTML" que fica em baixo da miniatura do seu blog, e clique em prosseguir no aviso que aparecer.
 Aperte Ctrl+F, procure por ]]></b:skin> e cole antes esse código:


/*** Rolagem da Vertical da Página ***/
::-webkit-scrollbar-thumb:vertical {
background: #ff0f72; /*Cor da barrinha que se move*/
border: 1px solid #bgh; /*Coloque borda se quiser*/
height:50px;
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
}
/*** Rolagem da Horizontal da Página***/
::-webkit-scrollbar-thumb:horizontal {
background-color:#ff0f72; /*Cor da barrinha que se move*/
border: 1px solid #bgh; /*Coloque borda se quiser*/
height:10px;
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
 }
/*** Parte fixa da rolagem (fundo que não se move) ***/
::-webkit-scrollbar {
height:10px;
width:15px; /*Largura da barra de rolagem*/
 background: #000000; /*Cor da parte fixa, que fica no mundo*/
border: 1px solid #bgh; /*Coloque borda se quiser*/
}


Faça as alterações necessárias conforme o indicado, e depois salve.
Espero que tenham gostado!
Beijos!

2 comentários:

  1. Adorei esse tutorial, tava precisando pro meu blog, até mais e muito obg Vicky! Beijos

    ResponderExcluir