2 de outubro de 2012

Tutorial - Barra de rolagem colorida

                                          Proximos post : Mini gifs de doces                                           
 Food_colours_pretty_tubes_candy_colour-6708b6a1368bce0c9903c4b364df60a8_h_large
Olá docinhos *__* tbm ou mais ou menos ?Como no ultimo post prometi um tutorial, desta vez peguei o da barra de rolagem colorida, aqui no PopRock eu fiz uma, eu peguei o tutorial do Cherry Bomb  ~creditos~ 

Ao final do tutorial, a barra de rolagem do seu blog vai ficar mais ou menos assim:



Vamos começar?
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*/
}


  É só alterar as cores conforme indicado, visualizar, e se estiver tudo certo, salve. Se não quiser cantos arredondados, apague as partes em verde.Pegue as cores da rabela de cores aqui fica super lindo, Kisses.

Nenhum comentário: