效果真不错,脱离桌面也可进行提醒。可以弄个每工作45分钟就出去休息15分钟的小贴士或者是类似 google calendar 的东东。
效果如图:
以下转自:http://www.cnblogs.com/yiciyun/archive/2012/09/02/2667863.html
HTML5开发 桌面提醒功能 Demo html5-desktop-notification.html (只支持 Chrome 浏览器)
详见代码:
<!DOCTYPE HTML>
<html>
<head
<meta charset="gbk">
<title>Creating OS notifications in HTML5</title>
</head>
<body>
<input type="button" value="验证授权" onclick="init();" />
<input type="button" value="弹出消息" onclick="notify();" />
<script type="text/javascript">
const miao = 5;
function init() {
if (window.webkitNotifications) {
window.webkitNotifications.requestPermission();
}
}
function notify() {
var icon = "logo.png";
var title = "Hello World";
var body = "You Are My World (5秒后自动关闭)";
if (window.webkitNotifications) {
if (window.webkitNotifications.checkPermission() == 0) {
var popup = window.webkitNotifications.createNotification(icon, title, body);
popup.ondisplay = function(event) {
setTimeout(function() {
event.currentTarget.cancel();
}, miao * 1000);
}
popup.show();
popup.show();
} else {
window.webkitNotifications.requestPermission();
return;
}
}
}
</script>
</body>
</html>
