浏览器桌面通知(notifications)
近期在做公司后台管理系统,当有任务到来时,须要通知当事人,可是 当事人有可能在做别的,浏览器有可能会被最小化,这样就非常难看到通知了。经过查找发现有些浏览器能够使用noitfications。能够在桌面的通知区域内显示一个提示框,而且显示在桌面的最前面,非常方便就能看到了。我就将它简单的封装一下,使其符合经常使用的使用场景。
功能效果类似webQQ的消息提示通知。
chrome
浏览器桌面通知
简单介绍
用于其余B/S下的网络办公提醒功能。
页面最小化的状态下发送通知
依旧显示在屏幕的右下角,立即能够看到内容
依赖
- PC chrome浏览器。
- 手机android 海豚浏览器
注意事项
通知权限是基于站点(或者域名),同一个站点以下的页面仅仅须要获取一次权限就可以。
假设别禁用了。将不会显示通
设置-》隐私设选以下的 “内容设置”-》通知
知的,也无法再次获取权限了。
能够同浏览器的菜单查看权限。
设置-》隐私设选以下的 “内容设置”-》通知
假设你关闭或者刷新页面了。之前的通知就没法控制了 。
使用
引用notify.js文件
<script src="notifiy.js"></script>
浏览器配置
检查浏览器是否支持桌面通知功能
Notifier.HasSupport();
获取同意桌面通知权限
Notifier.RequestPermission();
设置通知显示方式(可选。不设置採用默认模式)
Notifier.ModelAll(); //默认方式,显示全部的。在linux一般为三个。在window显示在通知区域。
Notifier.ModelUpdate(); //更新模式,显示在上一个通知的位置,
Notifier.ModelCount(c); //限制当前页面显示的通知个数,默觉得三个(能够通过參数c改变个数)。超出限制时关闭最早的通知,
NOtifier.ModelTimeout(ct); //超时消失模式。显示一定时间自己主动消失。发送通知
Notifier.Notify(icon, title, message); //显示桌面通知,icon:图片的地址 title:通知的标题 message:通知的内容
关闭的方法
Notifier.Clse(type); //type=1 关闭上一个 其它值 关闭最早打开的
Notifier.ClosePre(); //关闭近期个打开的通知
Notifier.CloseLast(); //关闭最早显示的通知
NOtifier.CloseAll(); //关闭全部通知其它方法
Notifier.GetPermission(); //获取关于通知使用权限,0,已经得到权限 1,须要获取权限 2,禁止使用
Notifier.IsGetPermission(); //是否已经获取通知的使用权限
Notifier.Disable(); //是否禁用通知
浏览器桌面通知(notifications)的更多相关文章
- 浏览器桌面通知--Notification
前言 最近项目上要用到浏览器桌面通知,之前虽然知道有这个东西,但是一直没有用过,借此机会了解下桌面通知的机制,在此分享下. 1.权限 首先需要明确的是,不是所有网页都可以发桌面通知的,不然不得烦死,那 ...
- 浏览器桌面通知Notification探究
首先说明,这篇博文不是科普讲解的,而是立flag研究的,是关于浏览器消息自动推送,就是下面这个玩意: 最近常常在浏览器看到这样的消息推送,还有QQ.com的推送,现在我对这个不了解,不知道叫消息自动推 ...
- 浏览器桌面通知Notification实践
一言不合就上图: 最近常常在浏览器看到这样的消息推送,还有QQ.com的推送,现在我对这个不了解,不知道叫消息自动推送对不对,这个时chrome浏览器的截图,出现在右下角,其他浏览器的样式可能有些微差 ...
- H5 notification浏览器桌面通知
Notification是HTML5新增的API,用于向用户配置和显示桌面通知.上次在别的网站上看到别人的通知弹窗,好奇之余也想知道如何实现的.实际去查一下发现并不复杂,且可以说比较简单,故写篇博客分 ...
- HTML5开启浏览器桌面通知 Web Notification
说明: 1.Chrome要求必须https才可以开启浏览器通知 2.显示图片在本服务器,不支持跨越 3.自定义声音Chrome不播放,Firefox正常播放 代码如下: <!-- /** * @ ...
- Chrome浏览器桌面通知提示设置
版本 24.0.1312.56 m 老版本23.* 桌面通知,也可以由用户在Chrome浏览器中自定义:板手 -> 选项 -> 高级选项 –> 通知 (管理例外情况…).
- 用于浏览器桌面通知的Web API 接口 -notification
notification 接口用于浏览器向用户提供通知内容:常见的如网页版的微信: 1.实现,需要Notifications API 提供的通知接口: 用法: let notification = n ...
- Chrome浏览器桌面通知提示功能使用
http://www.cnblogs.com/meteoric_cry/archive/2012/03/31/2426256.html
- HTML5桌面通知(Web Notifications)实例解析
先上一段代码,ie不支持,Chrome.fireFox.Opera支持 <!DOCTYPE html> <html> <head> <meta http-eq ...
随机推荐
- iphone 6s pp助手 越狱
https://www.apple.com/iphone-6/合适初高中学习英语http://www.travelchinaguide.comhttp://jailbreak.25pp.com/ ip ...
- ALSA音频工具amixer,aplay,arecord
ALSA音频工具编译安装 ========================================================================1.官网http://www. ...
- PHP - 多维数组
多维数组指的是包含一个或多个数组的数组. PHP 能理解两.三.四或五级甚至更多级的多维数组.不过,超过三级深的数组对于大多数人难于管理. 注释:数组的维度指示您需要选择元素的索引数. 对于二维数组, ...
- PCL库配置出现的问题(WIN10+VS2013)
边看电影边配终于配好了,中间出现了一些问题,在网上很难搜到,可能每个人都碰到的不同.摸索了一会终于都解决了,记录在这里,免得又碰到. PCL是什么东西就不在此介绍了. 主要是参考这篇博客做得,不过我后 ...
- android stagefright awesomeplayer 分析
主要调用awesomeplay.cpp的函数来实现音视频等功能,可以说是对awesomeplay.cpp的封装,进一步抽象,然后提供给上层调用,主要的调用者是MediaPlayerService.cp ...
- 第002篇 深入体验C#项目开发(一)
网上摘来的简介: <深入体验C#项目开发>通过10个综合实例的实现过程,详细讲解了C#在实践项目中的综合运用过程.这些项目从作者的学生时代写起,到项目经理结束,一直贯穿于作者 ...
- Html5 代码
随着HTML5的流行,许多网站开始介绍HTML5元素和属性的用法,以及各种教程,并且越来越多老的浏览器开始兼容HTML5. 本文作者编译了10段非常实用的HTML5代码片段,开发者可以直接拿过去使 ...
- EF MySQL 提示 Specified key was too long; max key length is 767 bytes错误
在用EF的CodeFirst操作MySql时,提示 Specified key was too long; max key length is 767 bytes错误,但数据库和表也建成功了.有高人知 ...
- UMl概述(转)
1. UML的组成 UML由视图(View).图(Diagram).模型元素(Model Element)和通用机制(General Mechanism)等几个部分组成. a) 视图(View): 是 ...
- Android 打开系统相册和系统视
1.打开系统相册 Intent intent = new Intent(Intent.ACTION_VIEW); intent.setType("vnd.android.cursor.dir ...