Scrolling bar:
Scrolling bar is displayed on right side of the browser tab if the webpage is in English and displayed on left side if the webpage is in Urdu or Arabic version. Scrolling bar help users to scroll up and scroll down webpage. Almost everyone, use the default scrolling bar it seems different in every version of browsers. If anyone have Firefox it will displayed as Firefox built scrolling style, also it depends on version of Windows. If anyone use Windows XP then it will be displayed in Blue color and if anyone use Windows 8 or any other Operating System it will displayed according to their OS builds. Some examples of Scrolling bar are given below. One of them is taken with default scrolling bar and other one is taken with scrolling script.
Do you want to make your blog scrolling bar
stylish and users attractive? Lets learn how to do this...Scrolling bar is displayed on right side of the browser tab if the webpage is in English and displayed on left side if the webpage is in Urdu or Arabic version. Scrolling bar help users to scroll up and scroll down webpage. Almost everyone, use the default scrolling bar it seems different in every version of browsers. If anyone have Firefox it will displayed as Firefox built scrolling style, also it depends on version of Windows. If anyone use Windows XP then it will be displayed in Blue color and if anyone use Windows 8 or any other Operating System it will displayed according to their OS builds. Some examples of Scrolling bar are given below. One of them is taken with default scrolling bar and other one is taken with scrolling script.
Steps to change style of
Scrolling Bar:
Step 1: Go to Blogger Dashboard> Template> Edit HTML.
Step 2: Copy the following code.
Step 1: Go to Blogger Dashboard> Template> Edit HTML.
Step 2: Copy the following code.
/* Tha cyber lounge*/
::-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, #FF33FF 10%, #FF33FF 51%);
}
::-webkit-scrollbar-track {
}
::-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, #FF33FF 10%, #FF33FF 51%);
}
::-webkit-scrollbar-track {
}
Step 4: Now search for the following code.
]]></b:skin>
Step 5: Paste the above
code just before/above the ]]></b:skin>.
Step 6: Now save the
template and you all are done. Now refresh you
blog page and you will see a new look of you scrolling bar J
Customization: if you want to customize
it then
1) To change background color of scroll bar change the text
in red to the color you want.
2)To change the width of scroll bar change the text in green but I don’t recommend this leave it as it is.
3)To change the color of scroll bar change the text in
purple to that you want;
That’s all.
Drop your comments
and questions below.
0 comments:
Post a Comment
Please Read The Rules Before Leaving a Comment:-
1.) Your feedback is always appreciated. We will try to reply to your queries as soon as time allows.
2.) Make sure to click the "Subscribe by email" link below the comment to be notified of follow up comments and replies.
3.) Please "Do Not Spam".
4.) Please "Do Not Add Links" to the body of your comment as they will not be published. If the queries contain link then never add HTML tag to it.
5.) Only "English" comments shall be approved and answered.
6.) Never Use Keywords In The Name Section Otherwise Your Comment Will Be Deleted.
7.) All comment will be deleted if it will not fulfill the requirements.