Remove Pop-up Tooltips on Web Pages.
On several sites that I visit - generally forums but a lot of others - I get a tooltip under my mouse when passing over certain elements. This is NOT the url hover on the lower-left-hand corner; I mean right under the mouse. On forums, it generally will read "No unread posts" or "12 unread posts" or something similar. On some sites, when I pass over a link the entire link will show in the tooltip, obscuring the link itself. This happens A LOT with pictures as well. I find this horrifically annoying. Setting browser.chrome.toolbar_tips to false does not affect it but does turn off the UI tooltips. Is there any way to turn these off?
I'm using the latest stable build (57.0.1) on Linux Mint 18.3 Cinnamon.
Thank You.
الحل المُختار
I found a workaround for this thanks to a little code from other sources that I modified. I added the following to userChrome.css:
#btTooltip, #un-toolbar-tooltip, #tooltip, .tooltip, #aHTMLTooltip, #urlTooltip, tooltip { font-size: 0px !important; font-family: tahoma, verdana !important; background-color: transparent; !important; color: transparent; !important; -moz-appearance: none !important; border-color: transparent; !important ; background-position: center center !important; background-repeat: no-repeat !important; background-attachment: scroll !important; }
By changing the font size to zero and the color, background-color, and border-color to transparent the tooltips no longer appear. They may still be there, but I can't see them. Hope this helps someone else.
Read this answer in context 👍 1All Replies (4)
Firefox will generate a tooltip after a brief delay if an element has a title attribute. For example:
<a href="https://support.mozilla.org/" title="Mozilla Support">Help</a>
If the tooltip appears quickly or has any formatting to it, it's most like created by the site attaching a mouseover event handler to the element. for example:
<h2 id="topic123456" onmouseover="showTip('topic123456');" onmouseout="hideTip('topic123456');">This forum is annoying!</h2>
This is also how sites generally attach image zoom boxes to thumbnail images.
Since mouseover events can be used for a variety of things, it might not be safe to strip them all out of a page. It would be preferable, if possible, to find an add-on (or a user script) that removes them from particular areas of a page that you specify.
P.S. The word chrome in browser.chrome.toolbar_tips and the names of many other preferences refers to Firefox's user interface area. that's in contrast to the word content.
Thank you very much for the information. Good call on the mouseover events; I certainly don't want to suppress them. After some investigating using inspect element I'm pretty sure that it's from the title attribute that I'm trying to get rid of. Is there any way to suppress that?
I don't think there is a built-in setting to ignore title attributes. Possible approaches are:
(1) Track down the internal element which is used to display the tooltip and hide it using a custom style rule.
(2) Use an extension or user script* to remove title attributes from parts of pages where you don't want to see them.
* A userscript is a JavaScript program you apply to pages (either all sites or selected sites) using a scripting host such as Greasemonkey, Tampermonkey or Violentmonkey.
Doing something general would not be a quick project from what I see at the moment, but a user script to modify a particular site's page layout might not take very long.
الحل المُختار
I found a workaround for this thanks to a little code from other sources that I modified. I added the following to userChrome.css:
#btTooltip, #un-toolbar-tooltip, #tooltip, .tooltip, #aHTMLTooltip, #urlTooltip, tooltip { font-size: 0px !important; font-family: tahoma, verdana !important; background-color: transparent; !important; color: transparent; !important; -moz-appearance: none !important; border-color: transparent; !important ; background-position: center center !important; background-repeat: no-repeat !important; background-attachment: scroll !important; }
By changing the font size to zero and the color, background-color, and border-color to transparent the tooltips no longer appear. They may still be there, but I can't see them. Hope this helps someone else.
Modified