如何使用jquery向用户显示弹出通知？ [英] How to display a pop up notification to the user using jquery?

问题描述

我正在开发一个应用程序，要求必须通知用户某些背景事件，即来自其他用户的邀请，提醒超时等。

I am developing an application which requires that user must be notified about some background events i.e. invitation from other user, reminder time out etc.

每当事件发生时将通知控制器，并且应向用户显示一个小窗口。

Whenever the event occurs the controller will be notified, and a small window should be displayed to the user.

我应该如何继续实现这一目标。哪种技术/工具对我有帮助。我正在使用jQuery，JSF 2.0和Spring 3.0。

How should I proceed to achieve this. Which technology / tool will help me. I am using jQuery, JSF 2.0 and Spring 3.0.

推荐答案

这将发出类似于stackoverflow的通知

this will give a notification similar to the stackoverflow

jQuery

$("#notification").fadeIn("slow").append('your message');
$(".dismiss").click(function(){
       $("#notification").fadeOut("slow");
});

HTML

<div id="notification" style="display: none;">
  <span class="dismiss"><a title="dismiss this notification">x</a></span>
</div>

CSS

#notification {
    position:fixed;
    top:0px;
    width:100%;
    z-index:105;
    text-align:center;
    font-weight:normal;
    font-size:14px;
    font-weight:bold;
    color:white;
    background-color:#FF7800;
    padding:5px;
}
#notification span.dismiss {
    border:2px solid #FFF;
    padding:0 5px;
    cursor:pointer;
    float:right;
    margin-right:10px;
}
#notification a {
    color:white;
    text-decoration:none;
    font-weight:bold
}

另外看看 mplungjan关于如何倾听的答案到服务器更新和消息加载

Also take a look at mplungjan's answer on how to listen to server updates and message load

这篇关于如何使用jquery向用户显示弹出通知？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！