Un pop-up est une action qui affiche une fenêtre permettant aux utilisateurs d'appeler plusieurs fonctionnalités d'extension. Elle est déclenchée par un raccourci clavier ou en cliquant sur l'icône d'action de l'extension. Les fenêtres pop-up se ferment automatiquement lorsque l'utilisateur sélectionne une partie du navigateur en dehors de celles-ci. Il n'existe aucun moyen de garder le pop-up ouvert une fois que l'utilisateur a cliqué ailleurs.
L'image suivante, tirée de l'exemple d'événement relatif à l'eau potable, montre un pop-up affichant les options de minuteur disponibles. Les utilisateurs peuvent définir une alarme en cliquant sur l'un des boutons.
<ph type="x-smartling-placeholder">
Enregistre une fenêtre pop-up dans le fichier manifeste sous la clé "action".
{
"name": "Drink Water Event",
...
"action": {
"default_popup": "popup.html"
}
...
}
Mettez en œuvre la fenêtre pop-up comme vous le feriez pour n'importe quelle autre page Web. Notez que tout code JavaScript utilisé dans une fenêtre pop-up doit se trouver dans un fichier distinct.
<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>
Vous pouvez également créer des pop-ups de manière dynamique en appelant action.setPopup().
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'});
}
});