Google Web Apps – How to Use Traditional Scroll Bars

google

More and more of the Google web apps replace their scroll bars with CSS based ones that require a mouse to scroll (traditional scroll bar control based ones allow you to use the keyboard for scrolling).

What ways are there to force the Goolge web site products (like Google Reader, Google Mail, Google Plus) to traditional scroll bar controls in various web browsers?

Edit:

It seems that the keyboard only works with the "main" scroll bar on a page. Since the CSS does not allow you to put the focus on other scrollable areas on a page.

I've tried this in GMail, Google Plus and Google Reader in Google Chrome and Microsoft Internet Explorer (and if I remember, the behaviour is the same in Apple Safari and Mozilla FireFox as well).

The "main" (usually the list of messages) scrollable area scrolls with the up/down arrows of the keyboard.

Other scrollable areas (folder list, chat contacts list, etc) cannot be scrolled with the keyboard, but can be scrolled with the mouse wheel.

Best Answer

Your best solution for now is to use a browser that doesn't support webkit-scrollbar, as if a page has that CSS, your browser will use it.

Here's an explanation why it cannot be "disabled":

::-webkit-scrollbar cannot be simply overridden to get the default style, the only way to do it is to remove all ::-webkit-scrollbar rules from the code. At that point, scrollable areas have to be forced to redraw the scrollbars. To do that you either quickly add and remove display:none; from or do the same thing with overflow:hidden; on scrollable elements. The problem with the first one is that the page flashes white at every page load; the second one is resource-intensive as it would have to whether check any element on the page overflows—not ideal.

Related Topic