Mas, enfim, vamos deixar os papos aleatórios de lado e vamos ao que nos interessa!
Hoje eu trouxe um tutorial que eu acho bem legal, que é a barra de rolagem com efeito hover! O resultado é super fofo *u* Eu achei esse tuto num blog que eu amo, que é o A última princesa, os créditos são todos à ela <3
Tutorial:
Vá no seu HTML, tecle ctrl f e procure por:
]]></b:skin>
E logo abaixo dessa tag, cole o seguinte código:
html::-webkit-scrollbar {width:22; height:auto;background: #D3D3D3;}html::-webkit-scrollbar-corner { background: #D3D3D3;}html::-webkit-scrollbar-button:vertical {height:1px;display:block;}html::-webkit-scrollbar-button:horizontal {width:1px;display:block;}html::-webkit-scrollbar-thumb:vertical {background: #DDA0DD;border: 1px solid #D3D3D3;border-right:none;-webkit-border-radius: 8px;}html::-webkit-scrollbar-thumb:horizontal {background: #DDA0DD;border: 1px solid #D3D3D3;border-bottom;}html::-webkit-scrollbar-thumb {background-image: url(http://static.tumblr.com/y2cy4ou/EU1lwium0/pat1.bmp);}html::-webkit-scrollbar-thumb:hover {background-image: url(http://static.tumblr.com/y2cy4ou/EU1lwium0/pat1.bmp);border: 1px solid #A2A2A2;}html::-webkit-scrollbar-track-piece {background: none;}html::-webkit-scrollbar:vertical {border-left: 1px solid #A2A2A2;}html::-webkit-scrollbar:horizontal {border-top: 1px solid #A2A2A2;}
Oque está em negrito é a cor do fundo sem o mouse por cima, o que está em sublinhado a cor da barra, e oque está em itálico é a imagem hover, se você quiser substituir por uma cor, só retirar o -image: url(http://static.tumblr.com/y2cy4ou/EU1lwium0/pat1.bmp) por : #códigodacor e o que está em roxo é a borda da barrinha e a do fundo. Bom, visualize, se estiver tudo certo, salve ^^
E ai gostaram do tutorial? Espero que sim, kissus ;*
ótimo tutorial,só não faço no meu blog porque eu acho que não fica muito bonito :D
ResponderExcluirNos outros blogs ficam bonitos,no meu eu já não acho.
cherrycandy-viih.blogspot.com
Deve ficar bem bonito.
ResponderExcluirhttp://magic--teens.blogspot.com.br/
Amei o tutorial!
ResponderExcluirVoce ganhou um selinho no meu blog,passa la para pegar!
BJS
--> coversofgirls.blogspot.com
Otimo tutorial. Adoreoi. Tudo bem explicadinho.
ResponderExcluirBeijos.
www.mundodajulia13.blogspot.com
Adorei o tuto ♥
ResponderExcluirbjinhos
Participe do primeiro concurso do blog que esta rolando! clique aqui <---
ótimo tutorial! talvez use no lay atual do meu blog! *-*
ResponderExcluirBeijos ~> Magic Touch