Jquery 如何在单击时设置一系列动画的动画？

我有一系列的元素，我想动画一个接一个点击。第一个将设置动画，但下一个不会。我错过了什么

---

您的选择器没有按您的想法操作

$('.slide').next().animate({"top" : "5000"}, 500);

$（'.slide'）

这是在课堂外选择所有元素的幻灯片。这意味着它正在选择“幻灯片蓝色”、“幻灯片红色”、“幻灯片黄色”和“幻灯片黑色”

$（'.slide'）。next（）

这将获取您选择的所有幻灯片的下一个同级（如果有），即“幻灯片蓝色”、“幻灯片红色”和“幻灯片黄色”

您的动画正在蓝色、红色和黄色上运行，只在顶部留下黑色

---

后续的按钮按下没有任何作用，因为black没有兄弟姐妹。

您的选择器没有按您的想法操作

$('.slide').next().animate({"top" : "5000"}, 500);

$（'.slide'）

这是在课堂外选择所有元素的幻灯片。这意味着它正在选择“幻灯片蓝色”、“幻灯片红色”、“幻灯片黄色”和“幻灯片黑色”

$（'.slide'）。next（）

这将获取您选择的所有幻灯片的下一个同级（如果有），即“幻灯片蓝色”、“幻灯片红色”和“幻灯片黄色”

您的动画正在蓝色、红色和黄色上运行，只在顶部留下黑色

后续按钮的按下不起任何作用，因为黑色没有兄弟姐妹。

执行以下操作：

向所有元素添加一个up类（只是将它们标记为up），然后使用以下代码：

$(document).ready(function(){



    $('.button').click(function(){  
        var slide = $('.slide.up').last();
        slide.toggleClass('up');
        slide.animate({"top" : "5000"}, 500);
    })

});

已测试，并按预期在JSFIDLE上运行。请执行以下操作：

向所有元素添加一个up类（只是将它们标记为up），然后使用以下代码：

$(document).ready(function(){



    $('.button').click(function(){  
        var slide = $('.slide.up').last();
        slide.toggleClass('up');
        slide.animate({"top" : "5000"}, 500);
    })

});

经过测试，它可以按预期在JSFIDLE上运行

您可以尝试以下方法-

你可以试试这个-

---

$（'.slide'）。next（）总是为同一个

li

选择。您需要一种方法来跟踪当前可见的一个。我不知道您要做什么，但这可能会有所帮助：$（'.slide'）。next（）总是选择相同的

li

您需要一种方法来跟踪当前可见的一个。我不知道您到底想要什么，但这可能会有帮助：谢谢！我对.length和.eq做了一些研究，我能理解你的解决方案。我唯一进一步的问题是“我——；”的目的。这篇文章的作用是什么？它减少了每次单击时隐藏的

.slide

元素的索引-3，2，1，0谢谢！我对.length和.eq做了一些研究，我能理解你的解决方案。我唯一进一步的问题是“我——；”的目的。这篇文章的作用是什么？它减少了

.slide

元素的索引，以便在每次单击时隐藏-3,2,1,0