Wyskakujące okienko to działanie, które wyświetla okno umożliwiające użytkownikom wywoływanie wielu funkcji rozszerzeń. Żeby je uruchomić, użyj skrótu klawiszowego lub ikony rozszerzenia. Wyskakujące okienka zamykają się automatycznie, gdy użytkownik zaznacza obszar przeglądarki poza nimi. Wyskakujące okienko nie może pozostać otwarte po tym, gdy użytkownik opuści stronę.
Poniższa ilustracja została wykonana z przykładu Drink Water Event i pokazuje wyskakujące okienko z dostępnymi opcjami minutnika. Użytkownicy ustawiają alarm, klikając jeden z przycisków.
Zarejestruj wyskakujące okienko w pliku manifestu pod kluczem "action"
.
{
"name": "Drink Water Event",
...
"action": {
"default_popup": "popup.html"
}
...
}
Wdróż wyskakujące okienko jak niemal każdą inną stronę internetową. Pamiętaj, że JavaScript używany w wyskakującym okienku musi znajdować się w oddzielnym pliku.
<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>
Wyskakujące okienka możesz też tworzyć dynamicznie, wywołując metodę 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'});
}
});