jQuery: Moving window (or FIFO) type DIV?

I have been trying to get this effect for a couple of hours now and I must admit I am failing at it. I am trying to construct a DIV that accepts a particular number of items (say 5), when the 6th item is added, the first item that was aded should be removed (first-in-first-out). The feel should have some kind of a fadeIn and fadeOut. Here's what I managed to write till now: ... //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 = $("
  • ").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(); } ); } I've tried a couple of variations but the final effect I am getting is not that of a FIFO. The elements disappear instantaneously despite the `delay` and `hide("slow")` calls. Anyone has a more straightforward approach?

    以上就是jQuery: Moving window (or FIFO) type DIV?的详细内容,更多请关注web前端其它相关文章!

    赞(0) 打赏
    未经允许不得转载:web前端首页 » JavaScript 答疑

    评论 抢沙发

    • 昵称 (必填)
    • 邮箱 (必填)
    • 网址

    前端开发相关广告投放 更专业 更精准

    联系我们

    觉得文章有用就打赏一下文章作者

    支付宝扫一扫打赏

    微信扫一扫打赏