Adding a colouful Scroll bar to Blogger

Every blogger loves to customize his blog with different widgets.But have you ever thought of customizing the  scroll bar with stylish scroll bar.This post will surely help you learn to change the scroll bar of blogger blog.Check out our scroll bar for live demo.

Complete PC Guide's scroll bar.

Steps to change the scroll bar

1. Go to your blogger dashboard > Template >Edit HTML
2. Search for ]]></b:skin>
3. Paste the below code just before the above code.                                                                                            /* Complete PC Guide */
   ::-webkit-scrollbar {
   background:#fff;
   width:10px;
   }
   ::-webkit-scrollbar-thumb {
   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
   background-image: -webkit-linear-gradient(top, #336699 10%, #336699 51%);
   }
   ::-webkit-scrollbar-track {
   }
   
4. You are done.Save the template and check out your new scroll bar.

Customizations

• To change the scroll bar background color replace #fff with your color code.
• To change the scroll bar color replace 0, 0, 0 with the RGB color code.
• To change the thickness replace 10px to desired width.

http://html-color-codes.info/  showing the RGB color code for a color.

To find the HTML color code or for the RGB color code visit here.

Share this Post

SHARE SHARE SHARE

About Shan Eapen Koshy