可以关闭的jquery通知栏?

前端之家收集整理的这篇文章主要介绍了可以关闭的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/

原文链接:https://www.f2er.com/jquery/179454.html

猜你在找的jQuery相关文章