felix_h
felix_h

Reputation: 23

How to close popup.html for my google extension?

How can I visibly hide my popup.html whenever I click a button on that popup. I want to keep my scripts running but minimize the popup off the page. The reason i'm doing this is because i'm making an eye dropper extension that can get the color under your cursor and perhaps that color is being blocked by the popup hence why I want to get hide it when I'm looking for a color. Once I've picked my color the popup reappears.

Upvotes: 0

Views: 101

Answers (1)

woxxom
woxxom

Reputation: 73526

You'll have to resize the popup e.g. by hiding everything inside. The minimum size is still 16x16.

popup.js should call start() inside some event listener:

function start() {
  Object.assign(document.documentElement, {
    className: 'hidden',
    title: 'Click to cancel',
    onclick: stop,
  });
}
function stop() {
  Object.assign(document.documentElement, {
    className: '',
    title: '',
    onclick: null,
  });
}

popup.css:

html.hidden * {
  display: none !important
}

html.hidden::after {
  content: 'x';
  text-align: center;
  display: block;
  cursor: pointer;
}

Upvotes: 1

Related Questions