Strange behavior using vertical scroll bars with Touchpad

Ubuntu-mate 20.04.1

This one is a bit hard to explain but here goes...

I use my laptop Touchpad to move the cursor around. In my Firefox browser often when I go to the vertical scroll bar to scroll down the page... I left click on the scroll bar, hold the left button, then start dragging down on the Touchpad but the scroll bar will jump and skip all the way to the bottom of the screen even though I'm just dragging it down a little and slowly too. Sometimes the scroll bar keeps skipping down the page even when I am not dragging the cursor down at all. This happens in Brave Browser as well.

I tried playing with the TouchPad > Pointer Speed settings (Acceleration and Sensitivity) in the Mouse Preferences Application but I can't find a way to make the vertical scroll be predictable like I am used to in Windows.

Any help much appreciated!

Flex

Hi :slight_smile: Strange issue ...
Is it also happening when you drag a file on your desktop ?
Is it happening only with your touchpad ? Do you have a other pointing device plugged in to your computer that can disturb your touchpad ?

Hello,

No, I can't reproduce it using native applications like Caja or Pluma for instance.. I don't have another pointing device or anything else plugged in to the laptop either. I think it's just Firefox. Not sure what else to try. Cheers.

Flex

Can you try playing with this setting to try ?
It should be related ...

https://support.mozilla.org/en-US/questions/928979

Thanks for your help. I went in to Firefox preferences and disabled "Use smooth scrolling" but I still have the same issue. I'll keep googling!

What about trying this :

https://www.maketecheasier.com/change-the-scrolling-speed-in-firefox/#:~:text=Open%20a%20new%20tab%20in,type%20“%20about%3Aconfig%20“.&text=3.,that%20is%20suitable%20for%20you.

I'm not a firefox expert :laughing:

(To make sure my terminology is clear to you: In the following picture, the "slider" is the blue part, while the "trough" is the darker gray part apparently behind the blue slider.)

So you're telling me that if you click on the vertical scrollbar's "slider" (the movable indicator part), that the scrollbar starts skipping down the screen one page or so at a time in Firefox and Brave; yet this doesn't happen in any other application you can find?

Weird. Using the Screenshot tool in the MATE Menu, can you show us how tall the scrollbar is and (if possible) where you click to cause this strange phenomenon? The only things I can think of that would cause this are either you use a weird cursor theme, or you've got a strange Firefox theme indeed, or maybe it's a Firefox bug.

BTW, as a touchpad user of many years, I can offer some cool touchpad tips (just a few): You can scroll vertically by either (it depends on your setup) placing two fingers on the touchpad and dragging both in a downward (or upward) fashion, or dragging one finger across the right edge f the touchpad. You can horizontally scroll by either dragging your fingers in a horizontal direction, or by swiping your finger across the bottom edge of the touchpad, or sometimes by holding down Shift while dragging vertically. Furthermore (you can do the following with a conventional mouse too), you can jump to a position in a document by middle-clicking on a point on the scrollbar which you want to scroll to. (Middle-click on a touchpad is usually a three-finger tap.) A left-click is a single one-finger tap; a right-click is a single two-finger tap; and to drag with the left button, you can tap in a "down-up-down" fashion (place your finger on the touchpad, promptly lift it, and then promptly let it down again, before moving / dragging your finger accordingly). I know that's a lot to memorize, but it can be a real time saver sometimes, as a side note.

1 Like

Hello @gordon. Thank you for chiming in. It's not easy to predict when this happens... usually on longer webpages. e.g: www.bbc.co.uk but it has also happened on this Mozilla Firefox thread page where I posted a question about the problem. And that page is not very long at all.

Each time I hover the cursor over the "slider" and it's when I left click down on it then it will sometimes just fly off down the page.... or else it won't happen until I have started dragging down to scroll down then it starts skipping and jumping down the screen in excess of what I expect from my dragging.

Today I installed Manjaro/KDE in Virtualbox (manjaro-kde-21.0.2-210419-linux510.iso)

I don't have this problem with the vertical scroll bar skipping down the page in Firefox running in Manjaro. I also installed Brave in the same OS and couldn't reproduce the problem with that browser either. So to correct myself from above, I don't see this problem in Brave.

I think it might be the combination of Firefox in Ubuntu mate. Others have reported this issue on the Mozilla forums but not sure if they are all using UMate. I considered it might be my trackpad but I installed the same Firefox version in UMate and Manjaro/KDE and I don't have the problem in Manjaro/KDE.

I hope we can get to the bottom of this because I was all set to have UMate as my daily driver OS. The menus and URL bar font size are too small in Brave and Chrome in UMate and by the way those browsers don't have that problem in Manjaro either...

Flex

1 Like

I've been testing this some more and I think I know what's happening. Maybe I'm the only one in the whole world doing this...

Maybe it's my no-longer 100% eyesight and bad habits but sometimes when I place the cursor over the Slider I don't place it exactly on the Slider but just a little to the left or right... just a few pixels.

When I do that in UMate the scrollbar flies up or down the page... in Manjaro/KDE it's more forgiving... if I click a few pixels too much to the left the Slider stays where it is... if I click a few pixels too far to the right the slider just bumps up or down a tiny bit. That exagerated response in UMate Firefox ruins the web browsing experience for me.

Here are screenshots of the scroll bar...

In UMate:
FireFox Scroll Bar in UMate

See how there is no right border? Maybe my monitor is set up wrong?

I think sometimes I'm using the trackpad to place the cursor all the way to the rightmost edge of the screen thinking the cursor will be on the Slider then... but UMate doesn't think it is. Then the Slider flies down the page when I press the left trackpad button.

And in Manjaro/KDE:
Firefox Scroll Bar in Manjaro-KDE

See how there is a visible border to the right of the scroll bar?

In this Scroll Bar design if I place the cursor all the way as far as I can to the right of the Slider and press the left button the slider pops up or down a little but I don't loose control of the page so I have to carefully scroll everything back to where I was reading.

As things stand I'll probably switch to Manjaro/KDE. Most of the time I'm on my laptop I'm using a web browser and this is just not a comfortable experience. Unless there is some way to tell the Firefox scroll bar in UMate to calm down!

Any advice much appreciated.

Flex

This is turning into a long thread! The good news I think I've found a work around which hopefully may help someone else.

Inspired by this thread: Tweaking your Scrollbar Settings.. I created this file in my home folder: /home/flex/.config/gtk-3.0/gtk.css

With this content:

scrollbar slider {
    /* Size of the slider */
    min-width: 15px;
    min-height: 15px;
    border-radius: 17px;

    /* Padding around the slider */
    border: 2px solid transparent;
}

scrollbar trough {
    background-color: shade(@theme_bg_color, 0.60);
}

scrollbar button,
scrollbar button.vertical,
scrollbar button.horizontal,
scrollbar .button,
scrollbar .button.vertical,
scrollbar .button.horizontal {
    color: shade(@theme_bg_color, 0.10);
    background-color: shade(@theme_bg_color, 0.4);
}

scrollbar.vertical slider,
scrollbar.vertical .slider {
    background-image: linear-gradient(to top,
                                      shade(@toolbar_gradient_base, 0.85),
                                      white);
}

scrollbar.horizontal slider,
scrollbar.horizontal .slider {
    background-image: linear-gradient(to left,
                                      shade(@toolbar_gradient_base, 0.85),
                                      white);
}

And now ALL my UMate vertical scroll bars have changed. This is what it looks like in Firefox:
FireFox in UMate Scroll Bar Fixed

And try as I may I cannot make the Slider skip down the page if I click one or two pixels to the left or right of it!! This is the same as what I was getting in Firefox in Manjaro/KDE.

The only thing now is can I change the Vertical Scroll Bars in JUST Firefox? I don't really want that scroll bar design in UMate system wide.

So I need advice about the necessary CSS change that would affect Scroll Bars in Firefox only? I think I needed to reduce the border or border radius value to stop the Slider flying off on me if I didn't click on it exactly right.

Update
I updated my gtk.css file to contain just this...

scrollbar slider {
    /* Size of the slider */
    min-width: 15px;
    min-height: 15px;
    border-radius: 17px;

    /* Padding around the slider */
    border: 2px solid transparent;
}

And this gives me a solution I am happy with:
Screenshot at 2021-04-26 23-21-15

The scroll bar Slider is a bit wider so easier for my eyes to activate with the cursor and its response to the cursor is reliable.

Lastly, if someone can explain the CSS change that I apparently made here that solved my problem I would be interested to know?

Cheers,

Flex

1 Like

I can explain why the change worked.

Short answer: No offense Mozilla, but the GTK+ 3 support in Firefox and similar applications is lacking.

I've actually read Mozilla's GTK user interface-styling code, and I've found at least four obvious typos. Scrollbars are by far the most error-prone part of the whole interface. And GTK+ 2 made foreign drawing (the practice of drawing an application's user interface using GTK styles but not using actual GTK user interface elements) pretty easy; GTK+ 3 oreign drawing is very hard to do correctly, since the manner to do such has changed at least three times since GTK+ 3 was released in 2011. Furthermore, GTK+ 3 doesn't even allow the programmer to draw some user interface elements with animations and other similar features we've come to expect. In other words, it's a miracle (OK -- maybe not quite) that Firefox can have a GTK+ 3-esque user interface at all.

So what you saw was Ubuntu MATE's Ambiant-MATE theme on Ubuntu MATE, and KDE's Breeze theme for GTK+ 3 on Manjaro. Ambiant-MATE uses some extra padding which Firefox chokes on (because the GTK+ 3 foreign drawing support is lousy), whereas Breeze does not. By widening the slider using your custom CSS, the padding is pushed over to the far right, beyond where it can be seen in the window anymore.

This is the best attempt at explanation I can make right now. As far as I know, all that I have said is true.

By the way, you can verify what I said by installing the Breeze theme on Ubuntu MATE (sudo apt install breeze-theme-gtk), then switching to Breeze as your desktop theme. Oh yeah, and comment out the stuff in your gtk.css file after doing so and log back in!

1 Like

@gordon
I tried installing the breeze-theme in UMate and was able to see the scrollbars/sliders working better. I was foolish at the start to think I needed to switch to a whole new distro just to fix the scrollbars!

I can see themes being a whole other can of worms I'll get stuck in so I'm staying with Ambiant-MATE and my little scrollbar tweak.

Thanks alot,

Flex

1 Like

Firefox v89 no longer obeys the gtk.css file unless you..

about:config
widget.non-native-theme.enabled (set to FALSE)

More details here.