This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

ابحث في الدعم

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Is the appearance of Javascript alerts modifiable in Firefox 4.0?

  • 7 ردود
  • 18 have this problem
  • 1 view
  • آخر ردّ كتبه cor-el

more options

Firefox 4.0 allows users to do a lot of customizing, which is great. Does this extend to the appearance of Javascript alerts?

Unlike Firefox 3.6, in version 4.0 when an alert pops up, the underlying web page is darkened, half opaque and half transparent. This focuses the user's attention on the alert box. Is there a way for me to change this setting to be 20% opaque, 80% transparent? That would make it easier for me to see what the alert is trying to tell me about the underlying web page.

Firefox 4.0 allows users to do a lot of customizing, which is great. Does this extend to the appearance of Javascript alerts? Unlike Firefox 3.6, in version 4.0 when an alert pops up, the underlying web page is darkened, half opaque and half transparent. This focuses the user's attention on the alert box. Is there a way for me to change this setting to be 20% opaque, 80% transparent? That would make it easier for me to see what the alert is trying to tell me about the underlying web page.

الحل المُختار

You can use code in Stylish or add code to userChrome.css below the @namespace line to change the background color and the transparency.

Some examples (first is the current default; only use one):

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

tabmodalprompt { background-color: rgba(25, 25, 25, 0.5) !important; }
tabmodalprompt { background-color: rgba(224, 224, 224, 0.1) !important; }
tabmodalprompt { background-color: transparent !important; }

Read this answer in context 👍 1

All Replies (7)

more options

Looks like this CSS code:

  • chrome://global/skin/tabprompts.css
more options

cor-el, when I go to the address in your reply, I see the Tab Modal Prompt styles, and I see a value of .5 for the alpha channel, but I don't understand whether this means that it can or cannot be tweaked by the user. Can you please elaborate? Thanks!

more options

الحل المُختار

You can use code in Stylish or add code to userChrome.css below the @namespace line to change the background color and the transparency.

Some examples (first is the current default; only use one):

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

tabmodalprompt { background-color: rgba(25, 25, 25, 0.5) !important; }
tabmodalprompt { background-color: rgba(224, 224, 224, 0.1) !important; }
tabmodalprompt { background-color: transparent !important; }

more options

Perfect! Thank you, cor-el.

more options

You're welcome.

Which code did you decide to use?

more options

I used

tabmodalprompt

{ 
 background-color: rgba(224, 224, 224, 0.1) !important; 
}

Now that you've shown me the articles on creating a userChrome.css file, I can learn a lot more about customizing.

more options

Thanks for posting that code.

See also this mozillaZine forum thread with a lot of examples for Firefox 4.

"Fx4 .css tweaks":