Đây là một vài CSS3 webkit thanh cuộn. chỉ hiện thị tốt trên mấy ông như
Chrome hoặc Safari.
một vài Code cho bạn thích trang trí thêm cho Blogger của bạn ngầu hơn.
có 16 Style. bạn chọn 1 cái trong số đó và chèn trước:
]]></b:skin> /*1
-----------------------------------------------------------------*/
#style-1::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);border-radius: 10px;background-color: #F5F5F5;}
#style-1::-webkit-scrollbar{width: 12px;background-color: #F5F5F5;}
#style-1::-webkit-scrollbar-thumb{border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #555;}
/*2
----------------------------------------------------------------------*/
#style-2::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);border-radius: 10px;background-color: #F5F5F5;}
#style-2::-webkit-scrollbar{width: 12px;background-color: #F5F5F5;}
#style-2::-webkit-scrollbar-thumb{border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #D62929;}
/*3
--------------------------------------------------------------------*/
#style-3::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #F5F5F5;}
#style-3::-webkit-scrollbar{width: 6px; background-color: #F5F5F5;}
#style-3::-webkit-scrollbar-thumb{background-color: #000000;}
/*4
--------------------------------------------------------------------*/
#style-4::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #F5F5F5;}
#style-4::-webkit-scrollbar{width: 10px;background-color: #F5F5F5;}
#style-4::-webkit-scrollbar-thumb{background-color: #000000;border: 2px solid #555555;}
/*5
--------------------------------------------------------------------*/
#style-5::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #F5F5F5;}
#style-5::-webkit-scrollbar{width: 10px;background-color: #F5F5F5;}
#style-5::-webkit-scrollbar-thumb{background-color: #0ae;background-image: -webkit-gradient(linear, 0 0, 0 100%,color-stop(.5, rgba(255, 255, 255, .2)), color-stop(.5, transparent), to(transparent));}
/*6
--------------------------------------------------------------------*/
#style-6::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #F5F5F5;}
#style-6::-webkit-scrollbar{width: 10px;background-color: #F5F5F5;}
#style-6::-webkit-scrollbar-thumb{background-color: #F90;background-image: -webkit-linear-gradient(45deg,rgba(255, 255, 255, .2) 25%,transparent 25%,transparent 50%,rgba(255, 255, 255, .2) 50%,rgba(255, 255, 255, .2) 75%,transparent 75%, transparent)}
/*7
--------------------------------------------------------------------*/
#style-7::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #F5F5F5;border-radius: 10px;}
#style-7::-webkit-scrollbar{width: 10px;background-color: #F5F5F5;}
#style-7::-webkit-scrollbar-thumb{border-radius: 10px;background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0.44, rgb(122,153,217)), color-stop(0.72, rgb(73,125,189)),color-stop(0.86, rgb(28,58,148)));}
/*8
--------------------------------------------------------------------*/
#style-8::-webkit-scrollbar-track{border: 1px solid black;background-color: #F5F5F5;}
#style-8::-webkit-scrollbar{width: 10px;background-color: #F5F5F5;}
#style-8::-webkit-scrollbar-thumb{background-color: #000000;}
/*9
--------------------------------------------------------------------*/
#style-9::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #F5F5F5;}
#style-9::-webkit-scrollbar{width: 10px;background-color: #F5F5F5;}
#style-9::-webkit-scrollbar-thumb{background-color: #F90;background-image: -webkit-linear-gradient(90deg,rgba(255, 255, 255, .2) 25%,transparent 25%,transparent 50%,rgba(255, 255, 255, .2) 50%,rgba(255, 255, 255, .2) 75%,transparent 75%,transparent)}
/*10
--------------------------------------------------------------------*/
#style-10::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #F5F5F5;border-radius: 10px;}
#style-10::-webkit-scrollbar{width: 10px;background-color: #F5F5F5;}
#style-10::-webkit-scrollbar-thumb{background-color: #AAA;border-radius: 10px; background-image: -webkit-linear-gradient(90deg, rgba(0, 0, 0, .2) 25%,transparent 25%,transparent 50%,rgba(0, 0, 0, .2) 50%,rgba(0, 0, 0, .2) 75%,transparent 75%,transparent)}
---------------------------------HẾT-------------------------------*/
DEMO
