如何使用jQuery'；s.slidedown with Prototype'；s.PeriodicalUp - How to use jQuery's .slidedown with Prototype's .PeriodicalUpdater

How to use jQuery's .slidedown with Prototype's .PeriodicalUpdater

我正在尝试构建一个activty流，该流将自动显示数据库表中的最新条目，并在每次输入新行时进行更新。

目前，它的工作方式是使用Prototype的Ajax.PeriodicalUpdater不断检查新条目，然后向用户显示，但这很不稳定。

我想使用jQuery的.slidedown动画从顶部在数据库幻灯片中找到任何新条目。

这是我现在的

在具有活动流的页面上：

<div id="activity"></div>

和javascript：

Event.observe(window, 'load', function() {  
updater('activity', 'activities.php');
});
function updater(element_id, element_page)
{
  new Ajax.PeriodicalUpdater(element_id, element_page, {
   method: 'get', 
   frequency: 1, 
   decay: 2
  });
}

activities.hp:

foreach($activities as $activity)
{
  // get time since created
  $created = strtotime($activity['Activity']['created']);
  $time_since = $this->Time->timeAgoInWords($created);
  ?>
   <div id="activity_item">
     <span id="type"><?php echo $activity['Activity']['type']?></span>
     <span id="created"><?php echo $time_since ?></span><br />
     <span id="event"><?php echo $activity['Activity']['event']?></span>
    </div>
  <?php
 }

关于如何将幻灯片向下的动画融入其中，有什么想法吗？还是我这样做完全错了？

使用jQuery定期更新程序插件可能会有更好的运气，可以在这里找到：https://github.com/RobertFischer/JQuery-PeriodicalUpdater/

例如，这将从/path/to/get/request轮询，并在id为#feed（最大长度为5个项目）的块的顶部添加一个新条目。

$.PeriodicalUpdater('/path/to/get/request', 
  {method: 'get', data: '', minTimeout: 10000, maxTimeout: 32000,
   multiplier: 2, type: 'json', maxCalls: 0, autoStop: 0},
 function(d, success, xhr, handle) { 
    $("#feed").prepend('<h3>'+d.something+'</h3>');
    $("#feed").children().first().css("display", "none");
    if ($("#feed").children().length > 5) {
        $("#feed").children().last().remove();
    }
    $("#feed").children().first().addClass("first")
        .next().removeClass("first");
    $("#feed").children().first().slideDown(200);
});