[html5]API详解14:Notification API PC端实现桌面提醒
桌面提醒功能可以在窗口隐藏甚至是浏览器最小化(不被激活)的情况下,依然可以对用户进行信息通信,采用的方式就是在电脑桌面的右下角弹出消息提示框。这样的一个功能可以使用在一些消息推送的场景下。不过,虽然html5可以实现这样的功能,但是目前浏览器对这个API的支持还不是很普及,其中Chrome和firefox都已经很好的支持,此外,要实现提醒功能,还需要用户在浏览器进行授权操作,否则无法实现。
1.Notification.requestPermission()
该方法用于获取用户授权操作,会返回一个参数,分别对应着3种状态,"granted"表示用户同意消息提醒;“|default”表示默认状态,既没有同意也没有拒绝;“denied”表示用户拒绝消息提醒。这个值保存在一个内部变量中,并且是只读的,通过checkPermission()方法可以提取到这个状态值。
2. new Notification('titleTxt',{'iconUrl','bodyTxt','lang','tag',‘dir’})
这个方法用于创建消息提醒,接受三个参数:iconUrl是icon的地址,titleTxt是标题消息,bodyTxt是消息主体,tag是通知框ID,lang是语言,dir是方向,都是字符串类型。
3.Notification.close();
关闭通知窗口
挺简单的一个API,下面看案例代码:
//发出权限请求
Notification.requestPermission(function (perm) {
if (perm == "granted") {
//获得允许权限
var n = new Notification("这是标题:", {
icon: "这是icon的url",
body:"这是主体信息"
});
}
setTimeout(function(){
//三秒后关闭
n.close();
},3000);
热门文章推荐
- 10款html5网页播放器推荐(总有一款适合你)
- [html5]html5+css3实现图片斜角切成直角梯形显示的源代码
- [HTML5]HTML5视频video时间事件代码
- [微信]iOS苹果和微信中音频和视频实现自动播放的方法
- [html5]html5视频全屏实现的源代码
- [Html5]mobile-agent移动Agent,就是具有移动性的智能Agent
- [html5]视频播放器js控制vedio视频和分段播放
- [html5]H5播放器:竖屏播放\横屏播放\跟随旋转例子