Is there a way to temporarily change the scrollbar width in FF or IE while I'm testing some layout code?
I remember reading something a while back about this being related to resolution, but can't quite remember. I tried changing the resolution of the puter itself, tried increasing browser font size, but both didn't work.
Update I've e across this thread that describes how to edit the settings from within Firefox, but it doesn't work smoothly, at least hasn't worked smoothly yet for me. The asker said it eventually worked for him, so I'll do more testing later.
Is there a way to temporarily change the scrollbar width in FF or IE while I'm testing some layout code?
I remember reading something a while back about this being related to resolution, but can't quite remember. I tried changing the resolution of the puter itself, tried increasing browser font size, but both didn't work.
Update I've e across this thread that describes how to edit the settings from within Firefox, but it doesn't work smoothly, at least hasn't worked smoothly yet for me. The asker said it eventually worked for him, so I'll do more testing later.
Share Improve this question edited Apr 2, 2010 at 11:55 goodan asked Apr 2, 2010 at 4:22 goodangoodan 971 gold badge1 silver badge4 bronze badges 3- What do you want this for anyway? :) – deceze ♦ Commented Apr 2, 2010 at 7:36
- I'm trying to detect things like window size, browser size, body size and other browser features like scrollbar width, and I'm (of course) noticing discrepancies between FF and IE. So that was part of the testing I was doing, trying to change scrollbar width to further experiment with it. – goodan Commented Apr 2, 2010 at 8:09
- @goodan if you're interested in scrollbar width I had given an answer some time ago which may be helpful stackoverflow./a/13382873/149636 – lostsource Commented Jan 13, 2013 at 14:35
3 Answers
Reset to default 3::-webkit-scrollbar {
width: 6px;
background-color: rgba(0,0,0,0);
-webkit-border-radius: 80px;
}
::-webkit-scrollbar:hover {
background-color: rgba(0, 0, 0, 0.09);
}
::-webkit-scrollbar-thumb:vertical {
background: rgba(0,0,0,0.61);
-webkit-border-radius: 80px;
}
::-webkit-scrollbar-thumb:vertical:active {
background: rgba(0,0,0,0.61);
-webkit-border-radius: 80px;
}
/*Try this*/
I think this might be what you are looking for...
http://www.kelvinluck./assets/jquery/jScrollPane/jScrollPane.html
It allows you to pletely control the style of your scrollbars.
You can do this the advanced appearance settings in Windows itself. Note that this will affect (almost) all applications, not just your browsers. You might also have to close and re-open the browser.
In Windows 7: Control Panel > Appearance and Personalization > Personalization > Window Color > click 'advanced appearance settings', set Item drop box to 'Scrollbars" (or click on the scrollbar in the example picture), set Size spin control
In Vista: Personalization > Windows color and appearance > Open classic appearance properties > Advanced > Item > scrollbar then adjust the size.
In XP: Right click on your desktop and select Properties. In the window which appears, click the Appearance tab. Now click the Advanced button at the lower right. Drop down the Item menu and select Scrollbar. Using the up and down arrows, you can increase or decrease the scrollbar size.