js+html+CSS+jquery实现无限滚动轮播列表

$(document).ready(function() {
    var $slider = $('.slider');
    var $first = $slider.find(':first-child').clone();
    $slider.append($first);
 
    var slideWidth = $slider.find('.slide').outerWidth();
    var slideCount = $slider.find('.slide').length;
    var slideHeight = $slider.find('.slide').outerHeight();
 
    $slider.css({
        'width': slideWidth,
        'height': slideHeight,
        'left': '50%',
        'margin-left': -slideWidth / 2
    });
 
    var $slideTrack = $slider.find('.slides');
    $slideTrack.css({
        'width': slideWidth * slideCount,
        'transform': 'translateX(-50%)'
    });
 
    var currentSlide = 0;
 
    function move(direction) {
        if (direction === 'right') {
            currentSlide++;
            if (currentSlide === slideCount + 1) {
                $slider.css('left', '50%');
                currentSlide = 1;
            }
            $slideTrack.css('transform', 'translateX(' + (-currentSlide * slideWidth) + 'px)');
        } else if (direction === 'left') {
            currentSlide--;
            if (currentSlide === 0) {
                $slider.css('left', '50%');
                currentSlide = slideCount;
            }
            $slideTrack.css('transform', 'translateX(' + (-currentSlide * slideWidth) + 'px)');
        }
    }
 
    $('.right-arrow').click(function() {
        move('right');
    });
 
    $('.left-arrow').click(function() {
        move('left');
    });
 
    setInterval(function() {
        move('right');
    }, 3000);
});

这段代码实现了无限滚动轮播的功能，并修正了原始代码中的一些问题，例如计算 slideCount 的错误。此外，代码中使用了 CSS transform 属性来实现滑动效果，这比使用 left 属性更加高效，并且修正了初始化时的错误。