HTML5使用Web Notifications简单实例

Notifications API 允许网页或应用程序在系统级别发送在页面外部显示的通知;这样即使应用程序空闲或在后台,Web应用程序也会向用户发送信息。

可以在MDN文档查看:https://developer.mozilla.org/zh-CN/docs/Web/API/notification/Using_Web_Notifications

一、实例代码


Notification效果


二、属性

`dir`是一个只读属性,它表示Notification中显示的文本方向

auto: 继承浏览器的语言设置里制定的方向 (默认)

ltr:从左到右

rtl : 从右到左

属性body内容主体了

属性icon图标,一张图片的URL

属性tag标签标明是否为同一通知

三、兼容性问题

Chrome 、Edge、Firefox、Opera、Safari等浏览器在不同版本中都开始支持 IE不支持

不同浏览器上支持略有差异

HTML5 Desktop Notifications是一个小型开源库,可以在不同的浏览器中统一HTML5 Notifications API

Github:https://github.com/ttsvetko/HTML5-Desktop-Notifications

因为IE的限制可以试一试另一个开源插件(在IE11上试过可以的)

Github:http://ie-web-notifications.github.io/开源代码:https://github.com/ie-web-notifications/ie-web-notifications

你可能感兴趣的:(HTML5使用Web Notifications简单实例)