I am working with desktop notifications for my web application using the standard Notification API. For the purposes of my initial development, I am using Google Chrome. With Chrome, when a page creates a Notification
object, the notification will stay on the desktop forever.
The Notification
prototype does have a .close()
method which allows for the closing of a notification that has been previously invoked. I figured that this, in conjunction with the setTimeout
function would make automatically dismissing notifications after a couple seconds a piece of cake. I even found a guide confirming my idea.
However, it seems that I am unable to get the scope of the notification to work properly with the setTimeout
function, and the .close()
method does not get called properly for each created notification.
Here is what I have tried (I used some code found in another answer as a starting point):
Button:
<button onclick="notifyMe()">
Notify me!
</button>
JavaScript:
<script>
// request permission on page load
document.addEventListener('DOMContentLoaded', function () {
if (Notification.permission !== "granted")
Notification.requestPermission();
});
function notifyMe() {
if (!Notification) {
//alert('Desktop notifications not available in your browser. Try Chromium.');
return;
}
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
var notification = new Notification('Notification');
notification.onclick = function () {
window.focus();
};
setTimeout(notification.close, 2000);
// Result: Uncaught TypeError: Illegal invocation
// also tried.....
// setTimeout(notification.close(), 2000);
// Result: notification stays open forever
// setTimeout('notification.close', 2000);
// Result: ReferenceError: notification is not defined
}
}
</script>
I would appreciate it if anyone who has experience with this could help me.
Launch the Settings app from the Start menu. Click the "Ease of Access" category. Choose a timeout from the "Show notifications for" dropdown menu, under "Simplify and personalise Windows."
Open Settings. Click on Ease of Access. Click on Display. Under the "Simplify and personalization Windows" section, use the Show notification for drop-down menu and select the option for how long you want notifications to appear on the screen. Options include: 5 seconds. 7 seconds. 15 seconds.
1 Launch the Settings app from the Start menu. 2 Click the "Ease of Access" category. 3 Choose a timeout from the "Show notifications for" dropdown menu, under "Simplify and personalise Windows." See More...
How to Change the Duration of Notifications on Windows 10 1 Open Settings 2 Click on Ease of Access. 3 Click on Display. 4 Under the "Simplify and personalization Windows" section, use the Show notification for drop-down menu and select the option for how long you want notifications to appear on the screen. ... See More....
When I wrap that into a function() {}
it works:
setTimeout(function() { notification.close() }, 2000);
See this fiddle: https://jsfiddle.net/drnz12n8/2/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With