|
Wkwkwkwk XD. |
Konnichiwa Minna~ maaf jarang nge-post lagi sekarang, soalnya, lagi males ngetik gitu <( _ 3_)> #lagikebalik. Nah... sekarang mud untuk ngepost sudah menjadi 35%. (
masih nge-cas :v) So... basa-basinya bentar aja, ntar batre kembung #Kiddingguys:v. Oke, sekarang, lanjut aja deh. Fathya mau posting, postingan selanjutnya :)
Note : This scrollbar only work in chrome and safari browser...
Firstly :
For blogskin Search </style> using ctrl+f or f3 and search ]]></b:skin> if you're using template designer..
Blogskins / Classic template : Paste the codes before / above </style>
Template designer : Paste the codes before / above ]]></b:skin>
Style no.1...
::-webkit-scrollbar {
width: 15px;
height: 15px;
}
::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment {
height: 15px;
width: 15px;
background: #FFD0DA ;
border: 3px solid #FFFFFF;
-moz-border-radius: 100%;
border-radius: 100%;
}
::-webkit-scrollbar-track-piece {
background-color: #FFD0DA;
border: 7px solid #FFFFFF;
}
::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
background-color: #FFD0DA;
background-image:url(http://www.dolliehost.com/dolliecrave/backgrounds/yummy/55.gif);
background-size:300%;
}
Style no.2...
::-webkit-scrollbar {
width: 15px;
height: 15px;
}
::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment {
height: 15px;
width: 15px;
background: #FFB4B4;
}
::-webkit-scrollbar-track-piece {
background-color: #D1F7B6;
border: 6px solid #FFFFDF;
}
::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
background-color: #FFFFFF;
background-image:url(http://www.dolliehost.com/dolliecrave/backgrounds/stripes2/232.gif);
background-size:500%;
background-position:0% 0%;
}
::-webkit-scrollbar-thumb:vertical:hover, ::-webkit-scrollbar-thumb:horizontal:hover {
background-size:100%;
}
Style no.3...
::-webkit-scrollbar {
width: 15px;
height: 15px;
}
::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment {
height: 15px;
width: 15px;
border-radius:10px;
background:url(http://www.dolliehost.com/dolliecrave/backgrounds/plaincolor/71.gif);
border: 2px solid #FFFFD7;
}
::-webkit-scrollbar-track-piece {
background-color: #FFFFD7;
}
::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
background-color:#FFFFFF;
background-image:url(http://www.dolliehost.com/dolliecrave/backgrounds/plaincolor/71.gif);
border: 3px solid #FFFFD7;
}
Style no.4...
::-webkit-scrollbar {
width: 15px;
height: 15px;
background-color:#FFFFFF;
}
::-webkit-scrollbar-button:end:increment {
background-image:url(http://www.dolliehost.com/dolliecrave/scrollbars/arrowdown.png);
background-repeat: no-repeat;background-position:center;
box-shadow: inset 0 0 2px 1px #DDDDDD;
}
::-webkit-scrollbar-button:start:decrement {
background-image: url(http://www.dolliehost.com/dolliecrave/scrollbars/arrowup.png);
background-repeat: no-repeat;background-position:center;
box-shadow: inset 0 0 2px 1px #DDDDDD;
}
::-webkit-scrollbar-thumb {
background-color:#E5CBFF;
border:0px solid #E5E5E5;
border-radius:0px;
}
::-webkit-scrollbar-track {
background:#FFFFFF;
border-radius:0%;
box-shadow: inset 0 0 2px 1px #DDDDDD;
}
Customize the style :
Orange text : Width and height of the scrollbar
Red text : Background image URL
CREDIT: kawaiilady.blogspot.com
izin pake yaa
ReplyDeleteSiap!
Delete