jquery通知バーを閉じることはできますか？

私はこのサイト上のような通知バーを探していました。これはトップに表示され、変更などの通知をユーザーに通知します。 jqueryのために見つけることができるのはthis one jquery通知バーを閉じることはできますか？

他にも他の提案や提案はありますか？

2011-09-18 Paul

"noty"。このサイトでさえ1つ！ – Blender

@Blender：Stackoverflowが稼働しているので、「これも」というのは簡単です。 –

このサイトのほとんどのものは、非常に最小限でシンプルです（明らかによくコーディングされています）。 – Blender

あなた自身で作成するのは簡単です。ちょうどそれ<body>タグの下の最初の<div>行い、このような何かにCSSを設定します。

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

をまたにクリックイベントを追加：あなたの通知の後

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

、単にそれを下にスライドさせますそれを閉じて、通知をクリア：

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

デモ：http://jsfiddle.net/AlienWebguy/Azh4b/

本当にStackOverflowのようにしたい場合は、通知を発行するときに単にCookieを設定すると、すべてのページが読み込まれ、適用可能なCookieを持つすべての通知が表示されます。

複数の通知が必要な場合は、#notifyを.notifyに変更してスタックアップしてください。このような何か：

$('.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/

出典

2011-09-18 22:09:42 AlienWebguy

自分自身を構築することは決して考えられません...理にかなっています。おかげさまで、偉大な例をありがとうございました:) – Paul

歓迎して嬉しいです:) – AlienWebguy

私は実際に私のいくつかのプロジェクトのためにこれに非常に類似したものを作っています。

JSFiddle demoがありますが、それはおそらくクリーニングと最適化を使用する可能性のある個人用のlibsコードからストレートなリフトですが、それはどのように動作するのか良い印象を与えます。

私のコードの追加ボーナスは、重複したアイテムを表示しないということです。既存のアイテムを「ping」します。通知のどこかをクリックすると、通知が閉じます。

私が見ることができる唯一の欠点は、メインコンテンツの一部をカバーしていることですが、通知コンテナをposition: staticというコンテンツの上部に配置すると解決できます。

私に説明したいことがあれば教えてください。 1つの答えで実行するコードはかなりたくさんあります。

これは、ある時点でこれを行うjQueryプラグインを作成しています。私はそれをここに投稿します。

NB。 setInterval()は、デモンストレーション目的でのみ使用されます。また、異なる色のアラート（成功、情報、警告、エラー - 緑、青、オレンジ、赤）があります。

出典

2011-09-18 22:01:10 Bojangles

あなたが試してみたいことがあります*作るのは本当に簡単です* https://github.com/needim/noty

出典

2012-09-07 10:09:48 leviathan

jquery通知バーを閉じることはできますか？

答えて

関連する問題