10

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!

user1200781
  • 111
  • 1
  • 5

2 Answers2

3

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.

Jongwoo Lee
  • 774
  • 7
  • 20
Gil Goldshlager
  • 651
  • 1
  • 8
  • 22
  • Intersting. I'd thoght of a better way: insted of image, make it real HTML content and offset it using CSS left and top. You can even monitor changes to the page to update accordingly. – Pacerier Aug 07 '17 at 15:04
1

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

wavetree
  • 1,531
  • 1
  • 13
  • 17