可以关闭的jquery通知栏?

我一直在寻找一个通知栏,像这个网站上显示的通知栏,通知用户更改等.它应该具有关闭的能力.所有我可以找到的 jquerythis one

有没有人有任何其他建议或建议?

超级容易建立自己的.只要使它成为第一个< div>在< body>之下标签,并将CSS设置为如下所示:

#notify {
    position:relative;
    width:100%;
    background-color:orange;
    height:50px;
    color:white;
    display:none;
}

然后在通知中,只需将其向下滑动:

$('#notify').html('new message').slideDown();

并添加一个点击事件来关闭它并清除通知:

$('#notify').click(function(){
    $(this).slideUp().empty();
});

演示:http://jsfiddle.net/AlienWebguy/Azh4b/

如果您想要真正让它像StackOverflow那样,您只需在发出通知时设置一个cookie,然后每次加载页面显示所有具有适用Cookie的通知.

如果您想要多个通知,请将#notify更改为.notify并堆叠em.这样的事情

$('.notify').live('click',function() {
    $(this).slideUp('fast',function(){$(this).remove();});
});

$(function(){
    notify('You have earned the JQuery badge!');
    notify('You have earned the Super Awesome badge!');
});

function notify(msg) {
    $('<div/>').prependTo('body').addClass('notify').html(msg).slideDown();
}

演示:http://jsfiddle.net/AlienWebguy/5hjPY/

相关文章
相关标签/搜索