How to temporary disable vertical scroll bar?

[nohissyfit]

Not sure if it is by design (Amazon) or what, but when I try to cancel an item in an order on Amazon, the items in the list have a checkbox on the right side of the screen.

The scroll bar is largely hidden until I hover over it then it expands to grab the slider. That then hides the checkbox. It's then a game of whacka-mole trying to click last visible pixel of the checkbox under the scrollbar in order to check it.

I can increase/decrease Width but the relationship stays the same under the scrollbar.

How can I temporarily disable the scroll bar expansion and let me whacka-the-mole?

Searched: Found many results for adding code into FFx, but that is major surgery for what I need.

[morat]

You can create a toggling bookmarklet to hide or show the scrollbars.

Code: Select all

javascript:(function(){
  var element = document.getElementById("cowabunga");
  if (element) {
    element.parentNode.removeChild(element);
  } else {
    var style = document.createElement("style");
    style.type = "text/css";
    style.id = "cowabunga";
    style.textContent = [
      "* { overflow: hidden !important; }",
    ].join("\n");
    if (document.head) {
      document.head.appendChild(style);
    } else {
      document.documentElement.appendChild(style);
    }
  }
})();

I didn't test the bookmarklet on Amazon since I don't have any orders currently.

Bookmarklet Builder
http://subsimple.com/bookmarklets/jsbuilder.htm

CSS Overflow
http://www.w3schools.com/css/css_overflow.asp

[xanthon]

I have been using that bookmarklet recently. Thank you. I have discovered that it not only hides scrollbars but also stops scrolling.

[dickvl]

Maybe disable overlay scroll bars via the about:config page or via Settings.
I don't know what OS you are on, but you can filter the about:config page for overlay (ignore the layout.testing pref).

[xanthon]

Thanks. I disabled overlay bars as soon as the preference was provided. I occasionally want to block the display of the main scrollbars.

[dickvl]

The normal way to hide the main scroll bars is by enabling them and then move them out of view via negative margin properties.
You likely need to add the !important flag to override existing rules and adjust the values.

Code: Select all

.browserContainer > .browserStack > browser {
 overflow-y: scroll;
 overflow-x: hidden;
 margin-top: -12.5px;
 margin-right: -8.5px;
 margin-bottom: -10px;
}

[xanthon]

Thanks. Like the original poster, I only want to hide the scrollbars temporarily. In my case it is when taking a screenshot of a page.