<html>
<head>
<title>浏览器桌面提醒</title>
<script>
function notify(title, content) {
if(!title && !content){
title = "桌面提醒";
content = "您看到此条信息桌面提醒设置成功";
}
var iconUrl = "http://www.zhoupengyu.cn/favicon.ico";
if (window.webkitNotifications) {
//chrome老版本
if (window.webkitNotifications.checkPermission() == 0) {
var notif = window.webkitNotifications.createNotification(iconUrl, title, content);
notif.display = function() {}
notif.onerror = function() {}
notif.onclose = function() {}
notif.onclick = function() {this.cancel();}
notif.replaceId = 'Meteoric';
notif.show();
} else {
window.webkitNotifications.requestPermission($jy.notify);
}
}
else if("Notification" in window){
// 判断是否有权限
if (Notification.permission === "granted") {
var notification = new Notification(title, {
"icon": iconUrl,
"body": content,
});
}
//如果没权限,则请求权限
else if (Notification.permission !== 'denied') {
Notification.requestPermission(function(permission) {
// Whatever the user answers, we make sure we store the
// information
if (!('permission' in Notification)) {
Notification.permission = permission;
}
//如果接受请求
if (permission === "granted") {
var notification = new Notification(title, {
"icon": iconUrl,
"body": content,
});
}
});
}
}
}
function autoClose(notification) {
if (typeof notification.time === 'undefined' || notification.time <= 0) { notification.close(); } else { setTimeout(function() { notification.close(); }, notification.time); } notification.addEventListener('click', function() { notification.close(); }, false) }
</script>
</head>
<body>
<button onclick="notify('温馨提示:','您收到一条新消息,请注意查收!')"> Click me! </button>
</body>
</html>
分享到:
相关推荐
实现这一功能主要依靠JavaScript(JS)和AJAX技术,以及音频播放和动态显示新消息提示框的方法。 知识点一:AJAX技术 AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个页面的情况下,能向服务器...
在本主题中,我们聚焦于如何使用JavaScript实现类似QQ或MSN的消息提醒功能,这涉及到实时通信、UI设计以及用户交互等多个方面的知识。 首先,实现这种消息提醒功能的核心技术是Websocket。Websocket是一种在客户端...
现在作web开发,常常遇到需要消息提醒功能,我在网上找了一个js右下角弹出提示消息的例子,用还是挺不错的,大家可以试试。
以上就是使用JavaScript、Ajax和jQuery创建类似QQ的消息提示框的基本过程,结合humane-js库,可以轻松实现丰富的提示效果。记得在实际应用中根据项目需求调整样式和行为,以提供最佳的用户体验。
本文将深入探讨“javascript 消息提示封装文件”,了解如何通过前端技术来实现高效、可复用的消息提醒功能。 首先,我们要明白什么是消息提示封装。在JavaScript中,封装意味着将特定的功能或行为打包到一个独立的...
基于JavaScript的消息提醒小示例可以帮助开发者快速构建这种功能,为用户提供实时反馈,增强系统的互动性。本文将详细解析这个基于JavaScript的Web系统消息提醒小示例,并提供源码分析。 首先,我们要理解...
在JavaScript(JS)中实现聊天应用的自动语音提醒功能,主要涉及到实时消息监听、音频处理以及用户交互设计等技术。以下是一些相关的知识点: 1. **事件监听**:首先,你需要监听聊天窗口或整个应用程序的“新消息...
"Toastjs一个JavaScript原型吐司消息" 这个标题指的是一个名为Toast.js的JavaScript库,它主要用于实现"吐司"(Toast)消息功能。在UI设计中,吐司消息是一种轻量级的通知方式,通常用于显示短暂、非中断性的提示...
标题中的“经典的js消息提示窗口”指的是一个集成了多种皮肤和易用功能的JavaScript库或组件,用于创建样式丰富、功能多样的消息对话框。 在描述中提到的“很多的皮肤”意味着这个js消息提示窗口库提供了多种视觉...
在实际使用中,你可以将Message.js 插件引入到HTML文件中,然后通过JavaScript代码调用其提供的方法来创建和管理消息提示。例如,你可以这样创建一个警告消息: ```javascript var message = new Message(); ...
【标题】"纯js超酷消息提示框插件notice.js"是专为网页设计者提供的一款轻量级、高效的消息提示框解决方案。该插件完全用JavaScript编写,无需依赖任何外部库,如jQuery,尽管在标签中提到了jQuery库,但实际使用中...
这对于提醒用户有新的信息或更新非常有用。在Windows操作系统中,这些通知会出现在任务栏的右下角。 要使用`Notification` API,首先要确保用户已经授权了接收通知。这通常通过在用户交互(如点击按钮)时请求权限...
网页消息提醒音js是网页应用中一种常见的交互设计,它能够通过播放特定的声音来通知用户有新的消息或者事件发生。这种技术在实时通讯、社交网络、在线协作工具等场景下非常常见,它能够提高用户的使用体验,使得用户...
在实现新消息提醒功能时,我们首先要创建一个DWR接口,这个接口包含一个方法,用于获取服务器端的未读消息数量。例如,我们可以定义一个名为`MessageService`的Java类,其中有一个`getUnreadMessagesCount`的方法,...
在JavaScript(JS)中,实现右下角弹出消息提醒是一种常见的用户交互方式,它可以向用户展示关键信息或反馈操作结果。本篇文章将深入探讨如何使用JavaScript创建这种功能,以及涉及的相关技术点。 首先,我们需要...
在JavaScript和jQuery的世界里,创建非阻塞式的消息提示框是一种优化用户体验的重要技术。传统的`alert()`函数在显示消息时会阻塞整个页面的交互,直到用户点击“确定”按钮,这种方式在某些场景下并不理想,因为它...
`JS`(JavaScript)作为浏览器端的主要脚本语言,提供了丰富的功能来增强用户界面。本文将深入探讨如何使用纯JavaScript实现浏览器的`title`闪烁、滚动、声音提示以及通知功能,而无需依赖任何外部库或框架。 首先...
本文将深入探讨如何使用JavaScript(JS)和Ajax技术来创建一款类似于QQ弹窗的炫酷消息提示框。 首先,我们来了解JavaScript(JS)。JavaScript是一种轻量级的解释型编程语言,广泛应用于网页和网络应用开发。它主要...
在JavaScript编程中,创建弹出消息提示框是常见的交互设计元素,可以用于向用户显示通知、警告或确认信息。在本教程中,我们将探讨如何实现一个类似于各大邮箱、QQ和MSN的消息提示框效果,该提示框会在页面的右下角...
现代Web开发中,许多库和框架如jQuery、Vue.js、React等提供了更高级的动画和组件功能,简化了消息提示的实现。例如,使用jQuery可以这样做: ```javascript $.fn.extend({ notify: function(message) { var ...