如何在将<li>添加到<li>组中时滚动该How

Question

我有一个能容纳4个<li>的分区容器

我要做的是在<ul>中预先添加一个<li>，然后删除最后一个<li>

我很容易就做到了，使用

$('#news-ul li:last').remove()
$('#news-ul').prepend(str);  //str contains a <li>

我想要有滚动效果时，<li>是前置。如何做到这一点？

Answer 1

我不确定我是否正确，但如果正确，我会首先创建一个新元素：

var newEle = $(str);

然后预置它，隐藏和动画

$('#news-ul').prepend(newEle);
$(newEle).hide().slideDown();

希望这能有所帮助。

编辑，更多代码：

看看http://api.jquery.com/category/effects/，如果我要重现推特效果，它可能是：

$('#news-ul').prepend(newEle);
$(newEle).fadeTo(0,0.01,function(){
    $(this).hide().slideDown('normal',function(){
        $(this).fadeIn();
    });
});

快速描述一下，首先我们像以前一样添加元素，然后在0秒内将它淡出到1%的不透明度(在0不透明度时它没有高度)，然后，当我们知道它淡出时，我们发出一个回调，完全隐藏元素，以正常速度向下滑动，当完成滑动时，我们发出另一个回调来淡入它。

警告：以上代码未经测试，使用风险自负^^

Answer 2

你可以看看

jQuery.ScrollTo插件