How to use the HTML5 desktop reminder function
This article mainly explains the "HTML5 desktop reminder function how to use", the article explains the content is simple and clear, easy to learn and understand, the following please follow the editor's ideas slowly in depth, together to study and learn "HTML5 desktop reminder function how to use" it!
A brief introduction to HTML5 Notification
HTML5 Notification, or desktop notification. At present, the browser is still a strict sandboxie working mode, which separates the communication between the browser and the desktop. Notification can span sandboxie and enable browsers to notify users of messages even in a minimized state.
2. Desktop reminder API
Copy the code
The code is as follows:
Window.webkitNotifications
There are three methods for this API:
Copy the code
The code is as follows:
RequestPermission requests desktop notification
CheckPermission check Desktop Notification license (PERMISSION_ALLOWED = 0, PERMISSION_NOT_ALLOWED = 1, PERMISSION_DENIED = 2)
CreateNotification create Desktop Notification
3. Desktop notification example
Let's use this desktop to notify API to write a small feature: send a message on the desktop every 20 minutes to remind the user to take a break.
The code is as follows:
Copy the code
The code is as follows:
If (window.webkitNotifications) {
If (window.webkitNotifications.checkPermission () = = 0) {
SetInterval (function () {
Var popup = window.webkitNotifications.createNotification ("avator.jpg", "if you spend a warm reminder:", "you will be blind in front of the computer for a long time, take a rest ~!")
Popup.show ()
}, 1000 * 60 * 20)
} else {
Window.webkitNotifications.requestPermission ()
}
} else {
Alert ('browser does not support desktop notification ~!')
}
And then the desktop will appear in 20 minutes.
Thank you for your reading, the above is the content of "how to use the HTML5 desktop reminder function". After the study of this article, I believe you have a deeper understanding of how to use the HTML5 desktop reminder function, and the specific use needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!
