8 de fev. de 2013

Personalizar barra de rolagem



Oi Gente !
Desculpem não postar antes, eu estou de castigo e acho que por causa dele vou demorar pra postar denovo.
Vim trazer um tuto o mais rápido que pude, pois só tenho 15 min. na internet :(

Para personalisar a barra de rolagem, vá em Designer > Modelo > Editar HTML e procure ( Ctrl + F ) por :

]] ></b:skin>.
Antes desse código cole :

    /*** 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*/
}


No código já tá tudo explicadinho. Para acessar a tabela de cores clique aqui
Para tirar as bordas arredondadas, é só apagar as partes em Italico.

Bom, hoje é só. No próximo post, vou caprichar mais, ta ? Creditos ao Coisas de Meninas.

Bjos pandinhas !

17 comentários:

  1. Gosto tanto de barra de rolagem personalizada, acho um charme *u*

    Kiss :*
    LittleMajestade|Blogspot

    ResponderExcluir
  2. Flor :3 Obrigada pelo comentário! Ajudando na sua meta :3

    Você interessa por esse template? http://ofamateens.blogspot.com.br/

    Se quiser coloco pra Download pra você :3 Beijinhos

    ResponderExcluir
    Respostas
    1. Own muito lindo mais não precisa se incomodar ! Bjos

      Excluir
    2. Flor, rsrs! Não é incômodo, haha! Eu mais pra frente vou colocá-lo, acho que amanha, hahaha!

      beijos

      http://www.belasenhorita.net.br/

      Excluir
  3. Que pena que está de castigo vim retribuir sua visita e estou te seguindo!!
    bjins
    http://miimix.blogspot.com.br/

    ResponderExcluir
  4. Adorei a dica!!!
    E que chato estar de castigo, espeor que isso passe logo!!! Vc aprontou né?! alkslaklskalks
    To seguindo o blog
    Ótima semana, fica com Deus
    Beeijinhos da Kell

    http://www.delicadinhah.com.br/

    ResponderExcluir
  5. Olá, gostaria de agradecer a visita no meu blog!
    Espero que logo saia do castigo e possa fazer muitos posts.
    Quando voltar a postar me avisa, que passarei aqui novamente.
    Bjuh...

    www.inadequada.com.br

    ResponderExcluir
  6. Adorei a dica, também acho um charme da barra de rolagem personalizada *-*!

    Obrigada pela visitinha, e logo logo estarei publicando o post com penteados para cabelo curto que você me pediu *-*
    beijos, http://www.bc-fotografando.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Estou precisando mesmo de um post desse, rsrs... Vou acompanhar. Bjos

      Excluir
  7. Bom tutorial.

    http://fashionistaapaixonada.blogspot.com/

    ResponderExcluir

Vai comentar ? Que bom, me deixa muito feliz :) Mas antes :

* Não ofenda ninguém.

* Comente sobre a POSTAGEM, ler não faz ficar com câncer.

* Não aceito "Seguindo, segue de volta ? " e outros comentários que estão na FAQ.

* Não utilize palavras de baixo calão.

Obrigada *--*