Make Chrome Extension Popup Window Transparent

Question

I am writing a chrome extension. I am wondering if there is a way to make the popup window transparent, that is the user can see the content of the current page even the popup window covers it. Thank you!

Answer 1

An interesting idea came to me mind yesterday, though you can't remove the white background, you can still mimic a transparent background.

This will be done by taking a screenshot of the page right before opening the popup and place it as a background image of the popup. I'm not sure how the background-image position calculations will go and if even possible but go give it a try.

Of course you will still have the popup's white border and box-shadow, but it should still look quite good.

Notice that this trick may not work good if there is any movement behind the popup as:

• Video / Audio players
• Image slider
• Ad banners
• Auto update news feeds (social media)
• CSS animations
• and so...

Taking a screenshot is done using captureVisibleTab from a background-script: https://developer.chrome.com/docs/extensions/reference/tabs/#method-captureVisibleTab

You will use messages or storage to send the screenshot image data to the popup.

Answer 2

There doesn't seem to be a way to do this. Chrome defaults to a popup background of white, unless you change it within your extension.

Google does mention that the popup will resize to its content, however. http://developer.chrome.com/dev/extensions/browserAction.html#popups