Highlight unloaded Tabs in Firefox
If you are currently working with Firefox 12 or later and making use of the browser's session restore feature, you may have noticed that only the active tab gets loaded during the start of the application. The remaining tabs do not get loaded until they are activated to improve the start up time of Firefox this way. It is a pretty useful feature, especially for Firefox users who work with dozens, or maybe even more than one hundred, tabs in the browser all the time.
One of the things that is missing is a visual distinction between tabs that have been loaded already and tabs that have not been.This can be useful to either avoid clicking on unloaded tabs, or find out which tabs have not been loaded yet to have them loaded by the browser. Unfortunately though, the Firefox feature makes no distinction between loaded and unloaded tabs.
You can however modify Firefox in a way that highlights unloaded tabs in the browser to have that visual distinction.
Highlighting unloaded tabs
You need to add custom CSS to the browser. This may sound difficulty at first, but is not really a issue. Let me show you how this is done.
The first thing that you need to do is open your Firefox profile folder. The easiest way to do that is to click on Firefox > Help > Troubleshooting Information (or by entering about:support in the address bar), and there on the Show Folder button in the profile folder line. This should open the profile in the default file viewer of the system.
Look for a chrome folder in that directory, if you can't find it, create it. Now open the folder and look for the file userChrome.css. If it is not there, create it and make sure its only extension is .css and not .css.txt. Open the file in a text editor and add the following lines of code to it:
.tabbrowser-tab[pending] {
opacity: .4;
}
Restart the Firefox web browser afterwards. You should now see that the opacity of unloaded tabs is different from the opacity of loaded tabs, so that it is easy to distinguish between the two types of tabs.
You can easily change the opacity value if you want to improve the readability of the unloaded tabs in the browser. Just select a higher value, .7 for instance instead in this case.
Advertisement
That’s all fine and dandy, but what if you have enough memory and want page to load “Automatically” in the background, not when I shift focus to it.
That’s the primary reason I open thing in new background tabs, so they can load while I do something else. So I don’t have to wait for it to load every time i switch tabs.
Simpler : you can create a style with Stylish.
No need to touch to “system files” from Firefox and can be easily tested, deactivated, etc.
I think my extension BarTab 3 is getting in the way of that code.
even adding !important didn’t make any changes.
now i did add border: solid 1px #ffffff !important;
that did have an effect but it wasn’t what you would expect which leads me to think BarTab is causing the problem or it is another extension.
I can’t say I noticed. I have my non-selected tabs set to show up in red italics under TMP. :)
beautiful it works exactly like you say it would thanks its very useful and it is better to install another extension for something so easy, very much recommended
Oddly, this does not work for Palemoon (Firefox-based). Oh well…