javascript - 我的垂直内容 slider 有一个错误

Question

当我单击任一按钮时，我的内容 slider 并不总是滑动到显示哈希。我通过观看此视频 Zhttps://www.lynda.com/jQuery-tutorials/Create-Interactive-Animated-Timeline-jQuery/124092-2.htmlZ (在 Z 之间复制)了解了如何做到这一点，然后我学会了https://www.youtube.com/watch?v=XrBuo3BZXlU&t=538s 上的左右 slider 控件。但是，我的代码似乎有一个错误，有时会阻止它转到下一张或上一张幻灯片。这是代码

$('.right').click(function(event) {
    $('#showing').removeAttr('id').attr('id','wasShowing');
    $('#wasShowing').next().attr('id','showing');
    $('#wasShowing').removeAttr('id');
}

https://jsfiddle.net/w3tkmhdn/1/

任何人都可以看到我的代码有问题吗？

Answer 1

您需要更新scrollLeft部分

$('.content-carousel').animate({
    scrollLeft: '+=' + $showing.offset().left
}, 800, );

https://jsfiddle.net/w3tkmhdn/2/

对于左和右，对于左，$showing.offset().left 返回负值，因此 += 按原样工作。