Ein Pop-up ist eine Aktion, bei der ein Fenster angezeigt wird, über das Nutzer mehrere Erweiterungsfunktionen aufrufen können. Sie wird durch ein Tastenkürzel, durch Klicken auf das Aktionssymbol der Erweiterung oder durch Drücken von chrome.action.openPopup() ausgelöst. Pop-ups werden automatisch geschlossen, wenn der Nutzer sich auf einen Bereich des Browsers außerhalb des Pop-ups konzentriert. Es gibt keine Möglichkeit, das Pop-up offen zu halten, nachdem der Nutzer weg geklickt hat.
Das folgende Bild aus dem Beispiel Wasser trinken zeigt ein Pop-up mit den verfügbaren Timeroptionen. Nutzer stellen einen Wecker ein, indem sie auf eine der Schaltflächen klicken.
Registriere ein Pop-up im Manifest unter dem Schlüssel "action".
{
"name": "Drink Water Event",
...
"action": {
"default_popup": "popup.html"
}
...
}
Implementieren Sie das Pop-up wie bei jeder anderen Webseite. JavaScript, das in einem Pop-up verwendet wird, muss sich in einer separaten Datei befinden.
<html>
<head>
<title>Water Popup</title>
</head>
<body>
<img src="./stay_hydrated.png" id="hydrateImage">
<button id="sampleSecond" value="0.1">Sample Second</button>
<button id="min15" value="15">15 Minutes</button>
<button id="min30" value="30">30 Minutes</button>
<button id="cancelAlarm">Cancel Alarm</button>
<script src="popup.js"></script>
</body>
</html>
Sie können Pop-ups auch dynamisch erstellen, indem Sie action.setPopup() aufrufen.
chrome.storage.local.get('signed_in', (data) => {
if (data.signed_in) {
chrome.action.setPopup({popup: 'popup.html'});
} else {
chrome.action.setPopup({popup: 'popup_sign_in.html'});
}
});