Jquery 在将Li移动到顶部时隐藏背景

我需要一个人帮忙 点击Li，我把它放在最上面，你可以在这里看到它工作的很好

在我的应用程序中，我有白色背景 但是当我的应用程序有白色背景时，移动背景时会发生什么呢。 我需要的是，当我的li在顶部移动时，它应该以这种方式调整背景

注：但方法应作为提供的第一个链接oi

---

提前谢谢

这是我准备的

您可能需要更改它以检查它是否是第一个被单击的项目

$('li.method-item').click(function () {
    var item = $(this);
    var ul = item.parent();
    item.css({
        position: 'absolute', 
        top: item.position().top, 
        width: item.width()+'px',
        background: '#fff'
    });
    item.animate(
        {top: 0}, 
        {speed: 200, complete: function(){
            var itemclone = item.detach();
            itemclone.css({position: 'relative', top: '0px', background: 'none'});
            ul.prepend(itemclone);
        }}
    );
});

编辑：
使用下面小提琴中的一个
我已经对它进行了更新，以确保单击的项目始终位于顶部，并检查是否单击了第一个项目

---

您可能需要添加一些有关所需内容的详细信息。就目前而言，很难知道你想要什么。看看我想要的是什么。假设我现在有5个李子，假设我把第4个李子移到顶部，当第4个李子离开它的位置时，上面的3个李子都向下移动，这时白色背景显示出来。我需要的是，当我点击第四个Li时，它首先移动到顶部，然后剩余的Li一起向下移动。这意味着我只需要假设当我点击第四个Li时，它应该在第0个位置上移动到顶部，同时第五个Li应该在第4个位置上移动，当第四个Li到达顶部时，它移动下面的所有Li意味着自动调整Hi，您的代码运行良好，功能齐全，但当我应用到代码中时，它会出现问题。第一个问题是我的整个设计传播开来。单击Li后，我将其css名称更改为“Selected”，单击后Li移动到顶部，但背景变为白色，因此我删除该背景：“#fff”，背景：“none”，这很好，但宽度会产生问题，即宽度：item.width（）+“px”现在所有Li的宽度都不相同，有些向后移动，有些向前移动。在以前的代码中，我没有为任何Li指定宽度，现在应用的Li存在适当调整的问题。您希望我如何帮助您解决这个问题？我看不到你的设计。嗨，我解决了宽度问题，感谢你的出色工作，但速度不是恒定的，这意味着点击第二个li时，它以慢速移动，点击第四个li时，它以高速移动。我希望所有可点击的Li都能以恒定的速度从任何索引移动，只需将项目索引值乘以速度值，并将结果作为速度值发送。当然你不需要另一把小提琴。是的，我试过了，但速度不是恒定的，你可以检查一下

  $('li.method-item').click(function () {

    var $this = $(this),

    callback = function () {
        $this.insertBefore($this.siblings(':eq(o)'));
    };
    $this.slideUp(500, callback).slideDown(500);
});

$('li.method-item').click(function () {
    var item = $(this);
    var ul = item.parent();
    item.css({
        position: 'absolute', 
        top: item.position().top, 
        width: item.width()+'px',
        background: '#fff'
    });
    item.animate(
        {top: 0}, 
        {speed: 200, complete: function(){
            var itemclone = item.detach();
            itemclone.css({position: 'relative', top: '0px', background: 'none'});
            ul.prepend(itemclone);
        }}
    );
});