1

我正在尝试在我的网站中实施通知系统。我从http://www.red-team-design.com/cool-notification-messages-with-css3-jquery中汲取了一些想法（别担心，它非常简单），我稍微修改了一下以适应用我的系统。

我的情况是我正在使用其中一个 div，'.info'确切地说是每次向该用户发送新消息时。到目前为止，我已经对其进行了设置，因此每次用户单击页面时，通知都会移出视口。

$(document).on('click',function()
{
    hideAllNotifications();
});

但是，我不希望在收到新消息时发生这种情况，因为用户可能没有注意到通知的出现，因此它应该是持久的，直到'.info'被按下，即当用户单击 .info 横幅时。但是，如果用户在视图中单击身体，.info那么它应该仍然存在。另一方面，如果所有其他通知 div.success, .error都是可见的，那么单击 body 应该只是隐藏这些 div。

那我该如何实现呢？我一直在尝试使用 offset()、position() 和 height() 检查信息是否在视口中，但它们不一致。

我试过了：

if(($('.info').position().top < 0))
{
    $(document).on('click',function()
    {
        hideAllNotifications();
    });
//      alert("info is out of view");
}
else
{
    $('.info').on('click',function()
    {
        hideAllNotifications();
    });
//      alert("info is inside our view");
}

这是我在页面刷新时获取新消息的功能：

function getNewMessage()
{
    //retrieve new messages
    showNotification('info', 'You have a new message');
}
4

0 回答 0