2012-03-17 16 views
1

JS:新しい通知のjQueryを検出

$(function() { 

$('.click_hide li').click(function() { 
    var $list = $("ul.system_messages"), 
     $this = $(this); 

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

$('.click_show li').click(function() { 

    if ($('.click_hide li').is(":visible")) { 
     $('.click_hide li').slideUp('fast', function() { 
      $('.click_hide li').hide(); 


     }); 
    } 
    if ($('.click_hide li').is(":hidden")) { 
     $('.click_hide li').slideDown('fast', function() { 
      $('.click_hide li').show(); 

     }); 
    } 



}); 

});​ 

HTML:

<ul class="notification click_hide"> 
    <li>New product has been purchased</li> 
    <li>Product out of stock</li> 
</ul> 
<ul class = "click_show"> 
    <li>Show Notifications</li> 
</ul> 

はCSS:

ul{ 
    border: 1px solid; 
    cursor: pointer; 
}​ 

私は/非通知を表示し、このサンプルの通知スクリプトを持っており、いつでもフィールドを削除通知がクリックされます。

私がしたいことは、新しいフィールド<li>が動的に挿入されたときです。私はその新しいフィールドを検出して強調表示したい、たとえばフィールドの色を赤に変更したい。新しい通知があるというテキストを作成します。

jsfiddle:http://jsfiddle.net/tmL7m/4

+0

http://jsfiddle.net/tmL7m/4/ を使用することができますフィドルリンク –

答えて

1

あなたはnotiification div要素にコンテンツをロードすると、5秒程度の色を変更します。通常の色に戻ります。これにはsetTimeoutを使用できます。あなたは既にjQueryのUIプラグインがあなたのページに含まれている場合

、あなたはこれがハイライト方式

$("ul.system_messages").load("load_from_server.php",function(){ 
     $(this).effect("highlight", {}, 3000); 
    }); 

http://docs.jquery.com/UI/Effects/Highlight

+0

ありがとう、しかし、私はここで '{}'と思っています。 –

+0

@JohnMicahFernandezMiguel:{}はパラメータです。そこに色を付けることができます。私が指摘したリンクのパラメータを確認してください – Shyju

+0

ああ、私はこれを試してみるよね。ありがとうございました! –

関連する問題