Javascript 持续向上滑动和淡入Div

我想做这样的东西。我想在右边的移动项目应该是幻灯片向上和淡出从底部到顶部。项目应连续移动，因此在最后一次div之后，它将重新开始。我试过我自己的代码。但坚持从起点出发。它不能从一开始就正确地开始

html

功能移动项（el）{
var x=1；
var标志=0；
var elems=$（el）.nextAll（）；
计数=元素长度；
各要素（功能（i）{
setTimeout（函数（）{
如果（x>1）{
y=x-1；
$（'#slider_'+y）.show（）.delay（2000）.slideUp（）.fadeOut（）；
}							
$（'#slider_'+x）.show（）.delay（2000）.slideUp（）；
x++；
如果（！--count）{
setTimeout（函数（）{
移动项目（“面板”）；
}, 6000)
}
}，i*2000）；
})
}
移动项目（“面板”）

滑块1
滑块2
滑块3
我稍微更新了您的逻辑以处理隐藏和显示。这里是更新的预览


功能移动项（el）{
var elems=document.queryselectoral（el）；
数组.from（elems）.forEach（（项，索引）=>{
setTimeout（函数（）{
指数+=1；
$（'#slider_'+index）.show（）.delay（2000）.slideUp（）.fadeOut（）；
如果（索引==元素长度）{
setTimeout（函数（）{
对于（j=1；jp请共享您的HTML和您所需内容的代码片段tried@AravindS我已经用html进行了更新。请检查define«start property»…非常感谢@Aravind。它几乎可以工作了。只是最后一项在函数第二次执行时有点晚。它在函数第一次执行时工作得很好。你知道吗？就在最后一项从函数第二次执行开始，项出现得有点晚：您是指删除所有内容后显示所有滑块时的延迟吗？否。删除所有内容后的延迟正常，但我不希望删除。我希望在最后一项后的底部插入第一个。但这里的问题是函数第二次执行最后一项时的延迟m不是从底部向上滑动，而是突然出现在屏幕上。抱歉……我无法理解。“但这里的问题是，当函数第二次执行时，最后一项不是从底部向上滑动，而是突然出现在屏幕上”-看起来像是只给我看的幻灯片请看：你可以在第一次通话时看到“steven”后面的“ben”幻灯片卡。但是在第二次通话中，它并没有向上滑动，而是突然出现。