X
Tap here to go to the mobile version of the site.

Support Forum

How to stop the tabs from highlighting as the mouse passes over them

Posted

With the newest firefox (72.0.2) I notice the tabs changing color as the mouse passes over them. A sort of greyish overlay appears over the background that is present before the mouse crosses into the tab. The selected tab does not change color; all the others do. This is really distracting to me; I never noticed it before. How do I get it to stop? (userchrome methods are fine.)

With the newest firefox (72.0.2) I notice the tabs changing color as the mouse passes over them. A sort of greyish overlay appears over the background that is present before the mouse crosses into the tab. The selected tab does not change color; all the others do. This is really distracting to me; I never noticed it before. How do I get it to stop? (userchrome methods are fine.)

Chosen solution

Using the Tools->Web Developer->Browser Toolbox inspector, I was able to identify the specific rule needing an override. This is what I wind up with:

  1. TabsToolbar:not(:-moz-lwtheme) .tabs-newtab-button:hover, #TabsToolbar:not(:-moz-lwtheme) .tabbrowser-tab:hover .tab-content:not([selected="true"])
 {
   background-image: url("file:///D:/System Graphics/Toolbar Backgrounds/rgsweeve - 000.bmp") !important;
 }

The specified background image (also specified for the non-hover state) remains shown and there is no flickering or changing as the mouse moves along the tabs.

Thanks very much.

Read this answer in context 0
Quote

Additional System Details

Installed Plug-ins

  • Shockwave Flash 32.0 r0

Application

  • User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:72.0) Gecko/20100101 Firefox/72.0

More Information

cor-el
  • Top 10 Contributor
  • Moderator
17863 solutions 161642 answers

Helpful Reply

Look for .tabbrowser-tab:hover to see what rules are active for hovering a tab.

You need to add the !important flag to override an existing CSS rule.

Look for .tabbrowser-tab:hover to see what rules are active for hovering a tab. *https://dxr.mozilla.org/mozilla-release/source/browser/themes/shared/tabs.inc.css You need to add the !important flag to override an existing CSS rule.
Was this helpful to you? 1
Quote

Chosen Solution

Using the Tools->Web Developer->Browser Toolbox inspector, I was able to identify the specific rule needing an override. This is what I wind up with:

  1. TabsToolbar:not(:-moz-lwtheme) .tabs-newtab-button:hover, #TabsToolbar:not(:-moz-lwtheme) .tabbrowser-tab:hover .tab-content:not([selected="true"])
 {
   background-image: url("file:///D:/System Graphics/Toolbar Backgrounds/rgsweeve - 000.bmp") !important;
 }

The specified background image (also specified for the non-hover state) remains shown and there is no flickering or changing as the mouse moves along the tabs.

Thanks very much.

Using the Tools->Web Developer->Browser Toolbox inspector, I was able to identify the specific rule needing an override. This is what I wind up with: #TabsToolbar:not(:-moz-lwtheme) .tabs-newtab-button:hover, #TabsToolbar:not(:-moz-lwtheme) .tabbrowser-tab:hover .tab-content:not([selected="true"]) { background-image: url("file:///D:/System Graphics/Toolbar Backgrounds/rgsweeve - 000.bmp") !important; } The specified background image (also specified for the non-hover state) remains shown and there is no flickering or changing as the mouse moves along the tabs. Thanks very much.
Was this helpful to you?
Quote
Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.