How to Make Invisible Scroll Bars
Scroll bars can help you navigate a page that is longer than the size of your screen. They can sit on the left- or right-hand side of your screen (usually the latter) and indicate which part of the page you are looking at. If you are designing a web page, you can change the CSS (cascading style sheet) of Internet Explorer to hide the scroll bar while maintaining the scrolling function. However, this isn't possible with other browsers, such as Safari, Firefox and Google Chrome, as users cannot edit this portion of their code.
Instructions
-
-
1
Open the CSS of the web page you are editing using a web editing program.
-
2
Locate the portion of the HTML code that determines the color and shading of the scroll bar. This will contain elements such as "scrollbar-face-color," "scrollbar-shadow-color" and so on.
-
-
3
Find the portion of the HTML code that determines the background color of the page you are working on. This will contain the phrase "background-color" and will contain an HTML color code or the name of a color. Make a note of this.
-
4
Return to the code that applies to different parts of the scroll bar and change the color section to match the background color of the page.
-
5
Check to make sure your coding is successful by viewing the web page. Because the scroll bar is now the same color as the background, it will be invisible. If the scroll bar is not invisible, go back and check the code again to ensure that you have changed all aspects of the scroll bar.
-
1
Tips & Warnings
This process only works with Internet Explorer 5.5 and later versions.
Always save a copy of your code before editing it.
References
- Photo Credit computer image by Hao Wang from Fotolia.com