Middle mouse button click + scroll also scrolls the ribbon

Question

Using Google Chrome I'm struggling with an issue which scrolls also the top ribbon of the SharePoint 2013 page. This happens when a page is scrolled to the bottom of the page by clicking the middle mouse button and moving to the bottom of the page.

This can be also seen if the middle mouse button is clicked over the ribbon, as the ribbon can be scrolled.

How to prevent the scrolling of the ribbon?

Update: I noticed that once middle mouse click + scrolled with Firefox, this does not happen. However when I use page anchors (e.g. Page.aspx#header2) the scrolling does occur on the suiteBar/ribbon.

It strongly seems like there's a hidden scrollbar within the suiteBar.

Answer 1

I was able to fix the problem by applying position: fixed to the html-Tag:

html {
  position: fixed;
}

Of course, this might have some unwanted side effects for other positioned elements (outside of s4-workspace)... But at first sight, everything still seems to work as expected...

Answer 2

This is happening because of #s4-workspace style having overflow:auto. I found this by removing it using the developer tools.

$(document).ready(function() {
    var isChromium = window.chrome,
    vendorName = window.navigator.vendor;
    if(isChromium !== null && isChromium !== undefined && vendorName === "Google Inc.") {
        // is Google chrome 
        var height = $('#s4-workspace').css('height');
        height = height - 100;
        $('#s4-workspace').css('height', height);
    } 
});