chrome浏览器的桌面通知
最近在使用朋友网(不加链接，避免有打广告的嫌疑)，发现会出现提示“是否允许网站显示桌面通知？”，如下图所示：
这种做法，在页面加载完时直接调用请求，比起开心网的这种提示感觉有些野蛮了。开心网的桌面通知提示如下：
先检查用户是否已经允许了本站的桌面通知，在未允许的情况下：点击后Chrome才出现提示，感觉更人性化一些，起码这个通知出现是由用户主动触发的。
这两个网站，发现桌面通知主要用于webIM的消息提醒。查了下资料，大概了解和掌握了Chrome桌面通知的。做了如下图所示的一个Demo：
完整的示例代码如下：
1: <!DOCTYPE html>
2: <html>
3: <head>
4: <title>Google 桌面通知</title>
5: <meta name="generator" content="editplus" />
6: <meta name="author" content="" />
7: <meta name="keywords" content="" />
8: <meta name="description" content="" />
9: <meta http-equiv='content-type' content='text/html; charset=utf-8' />
10: </head>
11: <body>
12:
13: <button id='btn'>显示桌面通知</button>
14:
15: <script type='text/javascript'>
1:
2: document.querySelector("#btn").addEventListener('click', notify, false);
3:
4: function notify() {
5: if (window.webkitNotifications) {
6: if (window.webkitNotifications.checkPermission() == 0) {
7: var notification_test = window.webkitNotifications.createNotification("http://images.cnblogs.com/cnblogs_com/flyingzl/268702/r_1.jpg", '标题', '内容'+new Date().getTime());
8: notification_test.display = function() {}
9: notification_test.onerror = function() {}
10: notification_test.onclose = function() {}
11: notification_test.onclick = function() {this.cancel();}
12:
13: notification_test.replaceId = 'Meteoric';
14:
15: notification_test.show();
16:
17: var tempPopup = window.webkitNotifications.createHTMLNotification(["http://www.baidu.com/", "http://www.soso.com"][Math.random() >= 0.5 ? 0 : 1]);
18: tempPopup.replaceId = "Meteoric_cry";
19: tempPopup.show();
20: } else {
21: window.webkitNotifications.requestPermission(notify);
22: }
23: }
24: }
</script>
16: </body>
17: </html>
chrome浏览器的桌面通知的更多相关文章
- 浏览器开启桌面通知Web Notification
本文主要描述如何开启各个浏览器的桌面通知功能 一.谷歌浏览器(chrome) 点击地址栏前面的图标
- selenium设置Chrome浏览器不出现通知,设置代理IP
from selenium import webdriver PROXY = "" chrome_options = webdriver.ChromeOptions() prefs ...
- 如何让Chrome浏览器可以加载本地XML文件？
Chrome浏览器的安全限制,禁止本地加载XML等外部文件,如何设置让其可以加载呢? 有两种方法,第一种是在本地服务器环境下浏览,采用 http://localhost/ 的方式浏览你的网页和文件,就 ...
- chrome浏览器访问Google的插件“谷歌访问插件”以及常用插件
1.解决新版谷歌浏览器无法从该网站添加应用.拓展程序和用户脚本 1.在Google Chrome浏览器的桌面快捷方式上鼠标右键,选择属性(R). 2. 在目标(T)后添加参数 --enable-e ...
- chrome——关于chrome浏览器的奇葩问题
前言 说下自己遇到的关于chrome的奇葩问题~ 问题 目前就一个,还是刚才才遇到的~ 消息通知 客户的chrome浏览器死活没有通知,检查后发现通知权限未开启, 通知权限开启后,还是没有提示,最后排 ...
- Chrome浏览器扩展开发系列之十：桌面通知Notification
Desktop Notification也称为Web Notification,是在Web页面之外,以弹出桌面对话框的形式通知用户发生了某事件.Web Notification于2015.9.10成为 ...
- Chrome浏览器桌面通知提示设置
版本 24.0.1312.56 m 老版本23.* 桌面通知,也可以由用户在Chrome浏览器中自定义:板手 -> 选项 -> 高级选项 –> 通知 (管理例外情况…).
- 浏览器桌面通知Notification探究
首先说明,这篇博文不是科普讲解的,而是立flag研究的,是关于浏览器消息自动推送,就是下面这个玩意: 最近常常在浏览器看到这样的消息推送,还有QQ.com的推送,现在我对这个不了解,不知道叫消息自动推 ...
- chrome扩展,如何阻止浏览自动关闭桌面通知.
(!!!!以前的好用的, 现在不行了~) 做chrome扩展桌面通知, 可能不想让浏览器自动关闭某个重要的桌面通知.那就不要使用 chrome.notifications.create 可以用 Web ...
随机推荐
- 使用Jquery UI 高仿百度搜索下拉列表功能
最近项目有个需求,在新添加商户的时候,用户输入商户名称后,如果系统中有类似的商户名称,直接显示出来,如下图的效果: 实现这个功能,直接使用了JQuery UI 插件 目前我使用的实现版本是: 网友可以 ...
- CMD下用csc.exe编译.cs 代码
用惯了VS来写C#代码,要是用记事本写会不会觉得很好玩,然后再CMD窗口下编译运行,当然写一些简单的Console代码还是可以这么玩玩的,如果你觉得打开VS太麻烦的话. 把后缀名改成.cs,test. ...
- Html5 代码
随着HTML5的流行,许多网站开始介绍HTML5元素和属性的用法,以及各种教程,并且越来越多老的浏览器开始兼容HTML5. 本文作者编译了10段非常实用的HTML5代码片段,开发者可以直接拿过去使 ...
- CodeSmith 模版
<%@ CodeTemplate Language="C#" TargetLanguage="C#" Src="" Inherits= ...
- iOS开发之UIApplication
UIApplication的核心作用是提供了iOS程序运行期间的控制和协作工作. iPhone应用程序是由主函数main启动,它负责调用UIApplicationMain函数,该函数的形式如下所示: ...
- 改错+GetMemory问题
试题1: void test1() { ]; "; strcpy( string, str1 ); } 试题2: void test2() { charstring[],str1[]; in ...
- go import
import "fmt"最常用的一种形式 import "./test"导入同一目录下test包中的内容 import f "fmt"导入f ...
- 踩坑学php（1）
前言: 为什么要学php 呢?作为一个前端,一直有着了解后台的好奇心:作为一个计算机毕业的,一直有着实践更多设计模式和数据库相关的东西:而php 非常流行,拥有非常多的资源,入门应该容易: 为什么叫& ...
- 绑定事件导致发送多个ajax请求的问题
如果遇到每次触发click, change等事件时ajax请求都会增加一个,这种情况很有可能是每次触发事件都会多绑定一个事件,解决办法就是在每次绑定事件之前要解除绑定.
- Digital Roots（hdoj1013）
Problem Description The digital root of a positive integer is found by summing the digits of the int ...