jQuery : 이동 창 (또는 FIFO) 유형 DIV?

Question

나는 지금이 효과를 몇 시간 동안 얻으려고 노력해 왔으며 나는 그것에 실패하고 있음을 인정해야한다. 나는 6 번째 아이템이 추가 될 때, 첫 번째 아이템이 제거되어야 함 (선입 선출), 아이템의 특정 수 (예를 들어 5)를 수용하는 DIV를 구성하려고합니다. 느낌은 어떤 종류의 fadeIn과 fadeOut을 가져야합니다. 다음은 지금까지 작성한 내용입니다.

... 
//Create a ul element with id 'ulele' and add it to a div 
... 
//Do an ajax call and when an element arrives 
Hash = ComputeHash(message) 
if(!$("#" + Hash).exists()) { 
    var element = $("<li></li>").html(message).attr('id', Hash).prependTo("#ulele"); 
    $("#" + Hash).hide().delay(10000 - 1000 * messageNumber).show("slow"); 
    _this.prune("#ulele"); 
} 
... 
prune: function(divid) { 
    $("#" + divid).children().each(
    function(i, elemLi) { 
     if(i >= maxMessages) 
     $(this).delay(10000).hide("slow").delay(10000).remove(); 
     } 
); 
} 

몇 가지 변형을 시도했지만, 최종 결과는 FIFO가 아닙니다. 요소는 delay 및 hide("slow") 호출에도 불구하고 즉시 사라집니다. 누구나 좀 더 직접적인 접근법을 가지고 있습니까?

Answer 1

이 시도 :

Hash = ComputeHash(message) 
if(!$("#" + Hash).exists()) { 
    var element = $("<li></li>").html(message).attr('id', Hash).hide().prependTo("#ulele"); 
    $("#" + Hash).show("slow", function() { 
    _this.prune("#ulele"); 
    }); 
} 
... 
prune: function(divid) { 
    $("#" + divid).children().each(
    function(i, elemLi) { 
     if(i >= maxMessages) 
     $(this).hide("slow", function() { 
      $(this).remove(); 
     }); 
     } 
); 
}