HTML5 Desktop Notifications (Web Notifications) are very useful when you need to have desktop notification effects when new messages come online. Here is a brief introduction to this new attribute of HTML5. Through Web Notifications (desktop notification system), the website can pop up a notification on the user's desktop. Regardless of whether the user is browsing the current web page or even minimizing the browser, the notification can reach the user's desktop.
<!DOCTYPE html><html> <head lang=en> <meta charset=UTF-8> <title></title> </head> <body> <script src=http://code.jquery.com/ jquery-1.8.0.min.js></script> <a onclick=showNotification();>Click me to see the information in the lower right corner</a> <script> function showNotification() { window.Notification.permission = granted; alert(window.Notification.permission); if(window.Notification) { if(window.Notification.permission == granted) { var notification = new Notification('You have a new message', { body: Hello I am Wang Xiaoting, icon: img/1.jpg }); setTimeout(function() { notification.close(); }, 5000); } else { window.Notification.requestPermission(); } } else alert('Your browser does not support this message prompt function, please use a browser with chrome core!'); }; </script> </body></html>Realization effect:
SummarizeThe above is the implementation of the notification function in the lower right corner of the Web Notification desktop in HTML5 introduced by the editor. I hope it will be helpful to you. If you have any questions, please leave me a message and the editor will reply to you in time. I would also like to thank everyone for your support of the VeVb martial arts website!