Wyskakujące okienko to działanie, które wyświetla okno umożliwiające użytkownikom korzystanie z różnych funkcji rozszerzenia. Można go wywołać za pomocą skrótu klawiszowego, klikając ikonę działania rozszerzenia lub wywołując chrome.action.openPopup(). Wyskakujące okienka są automatycznie zamykane, gdy użytkownik skupi się na innej części przeglądarki. Nie ma możliwości pozostawienia wyskakującego okienka otwartego po tym, jak użytkownik kliknie poza nim.
Poniższa grafika została wykonana z przykładu Drink Water Event i pokazuje wyskakujące okienko z dostępnymi opcjami minutnika. Użytkownik ustawia 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"
}
...
}
Wprowadź wyskakujące okienko tak samo jak dowolną inną stronę internetową. Pamiętaj, że kod JavaScript używany w wyskakującym okienku musi znajdować się w osobnym 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>
Możesz też dynamicznie tworzyć wyskakujące okienka, wywołując funkcję 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'});
}
});