javascript - 如何使用jquery向用户显示弹出通知？

Question

我正在开发一个应用程序，要求必须通知用户一些后台事件，例如来自其他用户的邀请、提醒超时等。

每当事件发生时， Controller 都会收到通知，并向用户显示一个小窗口。

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

Answer 1

这将给出类似于 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's answer关于如何监听服务器更新和消息加载