HTML5中的Web Notification桌面通知(右下角提示)
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<a onclick="showNotification();">点我看右下角信息</a> <script>
function showNotification() {
window.Notification.permission = "granted";
alert(window.Notification.permission);
if(window.Notification) {
if(window.Notification.permission == "granted") {
var notification = new Notification('你有一条新信息', {
body: "你好我是一只傻阿贝哟", icon: "img/1.jpg"
});
setTimeout(function() { notification.close(); }, 5000);
} else {
window.Notification.requestPermission();
}
} else alert('你的浏览器不支持此消息提示功能，请使用chrome内核的浏览器！');
};
</script>
</body>
</html>
HTML5中的Web Notification桌面通知(右下角提示)的更多相关文章
- 聊聊HTML5中的Web Notification桌面通知
有的时候我们会在桌面右下角看到这样的提示: 这种桌面提示是HTML5新增的 Web Push Notifications 技术. Web Notifications 技术使页面可以发出通知,通知将被显 ...
- 简单了解HTML5中的Web Notification桌面通知
原文:http://www.zhangxinxu.com/wordpress/2016/07/know-html5-web-notification/ 需要注意的是,消息通知只有通过Web服务访问该页 ...
- HTML5中的Web Notification桌面通知
大家在做一些浏览器端的聊天功能的时候,或者在一些网站跟在线客服咨询的时候,会看到一些消息通知的提示,常见的有浏览器标签页的闪烁和屏幕右侧的消息通知.本篇博客就在这里简单的介绍一下如何实现这样的功能. ...
- HTML5中的Web Workers
https://www.cnblogs.com/yanan-boke/p/6954390.html https://segmentfault.com/a/1190000014938305 HTML5 ...
- html5中的Web Storage
html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage.sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有 ...
- [html5] (Notification) 桌面通知
前几天要做一个桌面通知的功能,翻查以前做的笔记,发现webkitNotifications这个已经不能用了,baidu了下,基本都是介绍webkitNotifications的,后来在SOF上找到答案 ...
- HTML5中的Web Worker技术
为了让后台程序更好的执行,在HTML5中设计了Web Worker技术.Web Worker的产生主要是考虑到在HTML4中JavaScript Web程序都是以单线程的方式执行的,一旦前面的脚本花费 ...
- HTML5中的Web Worker
什么是 Web Worker? 当在 HTML 页面中执行脚本时,页面是不可响应的,直到脚本已完成. Web worker 是运行在后台的 JavaScript,独立于其他脚本,不会影响页面的性能.您 ...
- 在Eclipse中运行Web项目Jsp网页时提示端口被占用的解决办法：Several ports (8005, 8888, 8009) required by Tomcat v9.0 Server at localhost are already in use.
问题: 在Eclipse中运行Web项目Jsp网页启动Tomcat时提示端口被占用: Several ports (8005, 8080, 8009) required by Tomcat v9.0 ...
随机推荐
- 云笔记项目-测试时无法连接MySQL Server
事情起因:用Mac提交云笔记项目到SVN后,使用台式机import SVN上的云笔记代码,发现到了台式机上,进行junit测试时无法连接Mysql数据库服务器,而Mac上是可以的.以下是报警内容和报警 ...
- MySql union与order by
[MySql union与order by] 如果您想使用ORDER BY或LIMIT子句来对全部UNION结果进行分类或限制,则应对单个地SELECT语句加圆括号,并把ORDER BY或LIMIT放 ...
- 如何更改Oracle字符集避免乱码
转一位大神的笔记. 国内最常用的Oracle字符集ZHS16GBK(GBK 16-bit Simplified Chinese)能够支持繁体中文,并且按照2个字符长度存储一个汉字.UTF8字符集是多字 ...
- Dedecms织梦内容页获取当前页面顶级栏目名称方法
Dedecms织梦做站的时候,需要在当前页面调用顶级栏目名称的时候,织梦默认{dede:field name='typename' /} 可以获取当前栏目页上一级栏目的名称,而不是当前栏目顶级栏目名称 ...
- python使用websocket简单组建聊天室
server端 ###websocket_server### import socket import threading sock = socket.socket(socket.AF_INET, s ...
- Python3 round() 函数
Python3 round() 函数 Python3 数字 描述 round() 方法返回浮点数x的四舍五入值. 语法 以下是 round() 方法的语法: round( x [, n] ) 参数 ...
- chase
chase 英[tʃeɪs] 美[tʃes] vt. 追求; 追捕; 追寻; 镂刻; n. 追捕; 打猎; 猎物(指鸟兽等); 槽; vi. 追逐,追赶; 追寻; 追求(常与after连用); [口语 ...
- Nginx中超时时间配置（转）
本文介绍 Nginx 的 超时(timeout)配置.分享给大家,具体如下: Nginx 处理的每个请求均有相应的超时设置.如果做好这些超时时间的限定,判定超时后资源被释放,用来处理其他的请求,以此提 ...
- PyCharm 2019 最新激活方式总结（最新最全最有效!!!
host 注册码 http://idea.lanyus.com/ https://www.cnblogs.com/yjd_hycf_space/p/9110550.html ...
- MySQL在windows的my-default.ini配置
my-default.ini分为两块:Client Section和Server Section. Client Section用来配置MySQL客户端参数. 要查看配置参数可以用下面的命令: sho ...