MozillaZine

How can I increase the width of the scrollbar in FireFox ?

Discussion of general topics about Mozilla Firefox
tnek
 
Posts: 5
Joined: November 21st, 2005, 5:47 am

Post Posted February 16th, 2006, 8:28 am

The scrollbar in my FireFox is so narrow it's tough to grab. Is there an easy setting I can add to one of the config files to set the width wider ?

GameController
 
Posts: 470
Joined: October 1st, 2004, 9:13 pm
Location: Sunny California

Post Posted February 16th, 2006, 9:47 am

Paste this code in userContent.css and adjust the sizes

Code: Select all
/* Change width of VERTICAL SCROLLBAR */
scrollbar[orient="vertical"], scrollbar[orient="vertical"] thumb, scrollbar[orient="vertical"] scrollbarbutton { max-width: 15px !important; -moz-appearance: none !important; }

/* Change width of HORIZONTAL SCROLLBAR */
scrollbar[orient="horizontal"], scrollbar[orient="horizontal"] thumb, scrollbar[orient="horizontal"] scrollbarbutton { max-height: 15px !important; -moz-appearance: none !important; }

tnek
 
Posts: 5
Joined: November 21st, 2005, 5:47 am

Post Posted February 16th, 2006, 11:40 am

I pasted those into my userContent.css changed { max-width: 60px ....} . When I restarted FireFox nothing had changed.
Is there any other switch or something I need to change ? Any setting that might be over riding this ?
I even tried pasting it into UserChrome.css to no avail.

Monimonika

User avatar
 
Posts: 1067
Joined: July 27th, 2005, 12:49 pm

Post Posted February 16th, 2006, 12:53 pm

Did you close Firefox before doing the pasting? Did you go to the .css files in your profile folder (not the one in the program folder)?

http://kb.mozillazine.org/Profile_folde ... _folder.3F

tnek
 
Posts: 5
Joined: November 21st, 2005, 5:47 am

Post Posted February 16th, 2006, 1:59 pm

I just checked the file. Mine is located at
C:\Documents and Settings\Kent\Application Data\Mozilla\Firefox\Profiles\32hr4kz8.default\chrome\UserContent.css

Currently, that file contains:
marquee {
-moz-binding: none;
}
/* Change width of VERTICAL SCROLLBAR */
scrollbar[orient="vertical"], scrollbar[orient="vertical"] thumb, scrollbar[orient="vertical"] scrollbarbutton { max-width: 60px !important; -moz-appearance: none !important; }

/* Change width of HORIZONTAL SCROLLBAR */
scrollbar[orient="horizontal"], scrollbar[orient="horizontal"] thumb, scrollbar[orient="horizontal"] scrollbarbutton { max-height: 60px !important; -moz-appearance: none !important; }

I don't what it is or how that Marquee thing got in there but it was already there so I pasted your stuff after it. I have verified it's there.

I have even restarted my computer and restarted FireFox but there is no change.
Should perhaps I be entering { min-width: 60px ... ?

dickvl

User avatar
 
Posts: 51469
Joined: July 18th, 2005, 3:25 am

Post Posted February 16th, 2006, 4:35 pm

tnek wrote:I pasted those into my userContent.css changed { max-width: 60px ....} . When I restarted FireFox nothing had changed.
Is there any other switch or something I need to change ? Any setting that might be over riding this ?
I even tried pasting it into UserChrome.css to no avail.
You want to incease the default so you must use min-width and min-heigth
Code: Select all
/* Increase width of VERTICAL SCROLLBAR */
scrollbar[orient="vertical"], scrollbar[orient="vertical"] thumb, scrollbar[orient="vertical"] scrollbarbutton { min-width: 35px !important; -moz-appearance: none !important; }

/* Increase width of HORIZONTAL SCROLLBAR */
scrollbar[orient="horizontal"], scrollbar[orient="horizontal"] thumb, scrollbar[orient="horizontal"] scrollbarbutton { min-height: 35px !important; -moz-appearance: none !important; }

You can try without the -moz-appearance: none !important; to see what you like best.

You can put the same code in userChrome.css to make it work in chrome windows too (e.g. Extensions Manager)

dickvl

User avatar
 
Posts: 51469
Joined: July 18th, 2005, 3:25 am

Post Posted February 16th, 2006, 4:50 pm

Does anybody know why deceasing the scroll bar width in Fx 1.5 and 1.5.0.1 does work (userContent.css): the slider and thumbs are smaller, but the track doesn't change width? (works in Fx 1.0.7 and trunk versions).
I see nothing in the 'classic.jar\skin\classic\global\xulscrollbars.css' file indicating this.
Could it be caused by scrollcorner { background:url("chrome://global/skin/scrollbar/corner.png") no-repeat;}
not being resized.

I always work full screen with autohide extension and don't want the vertical scroll to take much space (causes appearance of a horizontal scroll bar sometimes) and I put the mouse cursor to the far right of the screen to operate the scrollbar.
Last edited by dickvl on February 16th, 2006, 5:27 pm, edited 3 times in total.

tnek
 
Posts: 5
Joined: November 21st, 2005, 5:47 am

Post Posted February 16th, 2006, 4:53 pm

Thanks, it's working now. Only problem I have now is that I have been using the Noia theme. Now, the scrollbar is wider but the theme is still showing the narrow scrollbar. It works but doesn't look good.

Kupfel

User avatar
 
Posts: 416
Joined: December 18th, 2005, 10:03 pm

Post Posted February 16th, 2006, 5:14 pm

well, you cant expect it to look good if you widen the scrollbar with css code..

if you are so depending on using scrollbars (no scrollwheel? on a tablet pc?) then you could try scrollbar anywhere:

http://www.extensionsmirror.nl/index.php?showtopic=194

which lets you scroll anywhere on the page, or grab and drag:

http://www.extensionsmirror.nl/index.php?showtopic=4349

which lets you scroll by dragging the page acrobat-style

paulfox
 
Posts: 1510
Joined: May 8th, 2004, 1:38 pm

Post Posted February 16th, 2006, 5:27 pm

@dickvl: Thank you for fixing that in a hurry - I'm using it as of 15 seconds ago. Excellent! First ones above no workie, at least for me. Cheers. I'll play with measurements.

I have a question since you da scrollbar man! What is the "grippie/gripper/slider button CALLED and why can't I seem to change its color from the default drab? I've done the background but can't find "code word" for the actual thing you drag.
PentiumIII/W2K, Toshiba AMD laptop/Vista. FX 3 on both.

dickvl

User avatar
 
Posts: 51469
Joined: July 18th, 2005, 3:25 am

Post Posted February 16th, 2006, 5:32 pm

This is the code of the scroolbar:
Code: Select all
/* ::::: scrollbar ::::: */

scrollbar {
  -moz-appearance: scrollbartrack-horizontal;
  -moz-binding: url("chrome://global/content/bindings/scrollbar.xml#scrollbar");
  cursor: default;
  background: url("chrome://global/skin/scrollbar/slider.gif") scrollbar;
}
So to change the slider how have to replace 'slider.gif'

paulfox
 
Posts: 1510
Joined: May 8th, 2004, 1:38 pm

Post Posted February 16th, 2006, 5:55 pm

I'm diggin' this! Just noticed that I had scrollbar COLOR stylish script transferred to userChrome, but it has to go in userContent AND userChrome, or you get it sometimes and not others (like this forum). I'll play with this new thing above/GIF image - used it before but replace with rgb(xxx,xxx,xxx) and it works fine.

So far,

scrollbar {
-moz-appearance: scrollbartrack-horizontal;
-moz-binding: url("chrome://global/content/bindings/scrollbar.xml#scrollbar");
cursor: default;
background: url("chrome://global/skin/scrollbar/CC33FF") scrollbar;
}

isn't doing it, but I'll work on it. Cheers and thank you Sir.
PentiumIII/W2K, Toshiba AMD laptop/Vista. FX 3 on both.

dickvl

User avatar
 
Posts: 51469
Joined: July 18th, 2005, 3:25 am

Post Posted February 16th, 2006, 7:54 pm

I think the gif is for the scrollbar background and Fx uses the windows default for the thumb color and that's why it doesn't work.

Return to Firefox General


Who is online

Users browsing this forum: No registered users and 2 guests