将循环功能添加到可单击的jQuery滑块（2）

我改编了一个发布在

请查看我的JS小提琴：

HTML代码：

<div class="slider">
    <div class="news-item item-1">News item 1</div>
    <div class="news-item item-2">News item 2</div>
    <div class="news-item item-3">News item 3</div>
    <div class="news-item item-4">News item 4</div>
</div>
<button id="prev-item">Previous</button><button id="next-item">Next</button>

JavaScript:

$( '#prev-item' ).click( function( event ) 
        {
            var animPrev = "+=500";
            if($( ".news-item" ).position().left=="0")
            {animPrev = "-=1500";}
            $( ".news-item" ).animate({
            left: animPrev,
        }, 1000, function() {
    });
});

$( '#next-item' ).click( function( event ) 
        {
            var animPos = "-=500";
            if($( ".news-item" ).position().left == "-1500")  
            {
                animPos = "+=1500";
            }
            $( ".news-item" ).animate({
                left: animPos,
            }, 1000, function() {
        });
    });

现在可以从头到尾循环幻灯片，但单击“下一步”或“上一步”按钮几下后，幻灯片效果就不再起作用了

---

有人能帮我翻译一下这段代码吗？

您应该以某种方式阻止单击队列，因为变量的一致性取决于它。因此，在预览和下一步之前，请单击检查是否使用此JQuery选择器设置了动画：

if( $(".news-item").is(':animated') ) {
    return;
}

在此处选中此选择器：

---

修正了

不确定在此处询问是否适合在另一个问题中回答的问题。您应该编辑帖子或在原始@CarlosHeredia中添加评论如果它解决了您的问题，您可以将其标记为正确答案吗？

if( $(".news-item").is(':animated') ) {
    return;
}