1.新/旧版本的chrome和firefox都可支持,IE下不支持因此设置为了在最小化窗口处闪烁显示提示文字。

2.设置为提示窗口显示5秒即关闭。

3.可设置图标和点击提示窗口要跳转到的页面(见输入参数)。

            var timer = null,  title = $('title').text();  $('body').on('click', function() {  clearInterval(timer);  $('title').text(title);  });  function showMsgNotification(title, msg , iconUrl ,clickUrl) {  var Notification = window.Notification || window.mozNotification || window.webkitNotification;  if (window.webkitNotifications) {  //chrome老版本  if (window.webkitNotifications.checkPermission() == 0) {  var notif = window.webkitNotifications.createNotification(iconUrl, title, msg);  notif.display = function() {setTimeout(function() {notif.close();}, 5000);}  notif.onerror = function() {}  notif.onclose = function() {}  notif.onclick = function() {window.focus();window.location.href = clickUrl;}  notif.replaceId = 'Meteoric';  notif.show();  } else {  window.webkitNotifications.requestPermission($jy.notify);  }  }else if(Notification) {//支持桌面通知  if(Notification.permission == "granted") {//已经允许通知  var instance = new Notification(title, {  body: msg,  icon: iconUrl //renotify : true
                        });  instance.onclick = function() {  //$('body').css({'background': 'red'});  //console.log('onclick');
                            window.focus();window.location.href = clickUrl;//window.open(clickUrl, "_blank");
                        };  instance.onerror = function() {  //console.log('onerror');
                        };  instance.onshow = function() {  setTimeout(function() {instance.close();}, 5000);};  instance.onclose = function() {  //console.log('onclose');
                        };  }else {//第一次询问或已经禁止通知(如果用户之前已经禁止显示通知,那么浏览器不会再次询问用户的意见,Notification.requestPermission()方法无效)  Notification.requestPermission(function(status) {  if (status === "granted") {//用户允许  var instance = new Notification(title, {  body: msg,  icon: iconUrl });  instance.onclick = function() {  window.focus();window.location.href = clickUrl;};  instance.onerror = function() {  // Something to do
                                };  instance.onshow = function() {  // Something to do
                                };  instance.onclose = function() {  // Something to do
                                };  }else {//用户禁止  return false; }  });  }  }else {//不支持(IE等)  var index = 0;      clearInterval(timer);  timer = setInterval(function() {  if(index%2) {  $('title').text('【   】'+ title);//这里是中文全角空格,其他不行  }else {  $('title').text('【快讯】'+ title);  }  index++;  if(index > 20) {  clearInterval(timer);  }  }, 500);  }  }

转载于:https://www.cnblogs.com/xcxcxcxc/p/6515896.html

JavaScript 兼容新旧版chrome和firefox的桌面通知相关推荐

  1. python新旧特性过渡_网站改版时的一种新旧版过渡方案

    网站改版时,需要考虑一个周全的过渡方案,其中不容忽视的一点就是对旧版的处理问题.即使借助完美的数据迁移方案可以使新版从内容上完全取代旧版,但我们仍然不应该立即彻底废除掉旧版,因为: 1.网民有可能通过 ...

  2. 天微TM1650数码管驱动IC新旧版 驱动和注意事项

    天微TM1650数码管驱动IC新旧版 驱动和注意事项 项目场景: 项目需要一个控制板和显示,通过一条1米数据线连接主控制 TM1650市面上多,价格便宜,使用简单, 相对于用逻辑门或单片机做,开发简单 ...

  3. 老毛桃U盘工具,自由更换系统,方便快捷,全面兼容新旧配置,自制引导盘和光驱无法更新系统,老毛桃引导盘用户可以自由替换系统,支持GHOST与原版系统安装,方便快捷,自动安装。支持双显卡笔记本的引导进PE

    老毛桃U盘工具,自由更换系统,方便快捷,全面兼容新旧配置,自制引导盘和光驱无法更新系统,老毛桃引导盘用户可以自由替换系统,支持GHOST与原版系统安装,方便快捷,自动安装.支持双显卡笔记本的引导进PE ...

  4. 旧版Chrome浏览器的安装和使用——chrome63

    虽然新版的Chrome浏览器很好用,但是界面风格我还是喜欢旧版的浏览器.我的电脑上有新版和旧版两个.不过正常情况下谷歌浏览器只能安装一个.我的做法是新版的浏览器正常安装,旧版的有点类似eclipse, ...

  5. Fiddler:Fiddler新旧版抓包相关总结

    CSDN个人主页: 高智商白痴 原文地址: https://blog.csdn.net/qq_44700693/article/details/109820296 申明:本来这篇博客是综合我个人在使用 ...

  6. Android设置白底黑字状态栏(已适配Flyme和新旧版MIUI)

    Android默认深主题色白字状态栏,这跟浅色的界面实在是不搭,那就改成黑字,底色随便改. 在Android6.0以前,这事不好办,所以MIUI自己实现了一个方法供开发者使用,Flyme也有(不知道是 ...

  7. 前端开发工具 vscode 使用技巧篇:控制台由powershell切换为cmd方法,windows下新旧版控制台cmd与powershell互切方法

    vscode 控制台切换方法 可以看到右上角是 powershell 不是 cmd. 通过 ctrl+shift+p,搜索出默认的 shell. 然后选择 cmd. 最后重启 vscode 就好了. ...

  8. 新旧版CCNP路由交换考试注意事项

    2010年4月26号以后就不能预定旧版CCNP绑定考试,4月26前预定过旧版CCNP考试的考生必须在2010年7月31前完成考试. 请提醒考生注意旧版考试BSCI,BCMSN和Composite(综合 ...

  9. 网站新旧版切换,新旧版共存一段时间,域名不变

    nginx 配置 upstream oldsite{server ip:88; } upstream newsite{server ip:80; } server {listen 80;server_ ...

最新文章

  1. 我学到的C#——基础
  2. 英伟达显卡功率(频率)锁死
  3. CXF 调用 .net webservice
  4. openssh相关文件传输功能
  5. mysql 提权方法_mysql常用的提权方法
  6. websphere jndi oracle,websphere7.0获得JNDI连接报invalid username/password
  7. 查询DB中每个表占用的空间大小
  8. getprivateprofilestring读不到数据_Tomcat NIO(11)请求数据读取
  9. dockerfile 创建Jenkins镜像
  10. 支持对抗样本防御的AI加速器架构设计
  11. 删除卸载不干净的任务 vmware卸载不干净->服务清理 / 注册表清理
  12. WIN10 拨号连接下 如何开启移动热点
  13. 第三方支付专业术语集锦
  14. lululemon最新报告建立全球幸福感基准
  15. PLC初学者梯形图编程原则
  16. 针对Unity导出的exe如果提示运行库报错或者系统缺少XX组件的对话框的话。一般解决办法如下:
  17. socket ftp android,使用 Socket 通信实现 FTP 客户端程序(二)
  18. 《创意特训营——30天超级灵感唤醒术》目录—导读
  19. 合并工作簿——《超级处理器》应用
  20. 每天两个设计模式(三)装饰器模式(今天就一个)

热门文章

  1. 基于51单片机的高频频率计的设计
  2. 【BLE】TLSR8258开发记录之10--更改MTU为245
  3. CTFshow 命令执行 web122
  4. 【Pytorch学习】用pytorch搭建第一个神经网络
  5. 2.3.3 Softmax回归介绍
  6. C++:录入班级数学成绩,计算最大值、平均值、不及格人数
  7. DIP第十章习题解答
  8. 2019-05-23 IRIS嗅探器;用IRIS嗅探数据;
  9. VC中实现GCC的2个比较常用的位运算函数
  10. javac、jar使用实录