跟新：

最后的问题所在：animate的时间跟setTimeout时间交叠了，导致left错误。

bannerInterval = setInterval(function(){
// 首页展示位置为 负的 一个图片的宽度
$('.jd_bannerImg').animate({'left':-n*bannerWidth},500);
n++;
setTimeout(function(){
if(n == 10){
// 一起共有10张图片 如 最后一张 第一张 第二章 。。。 最后一张 第一张
// 此时需要切换第一张，
// 问题在这里，本来应该直接到-bannerWidth ，但是出现从尾页滚动到首页问题
$('.jd_bannerImg').css({'left':-bannerWidth});
n = 1;
}
},500)
},1000)
}

1.看视频做教程，自己做的跟视频不一样，直接用**jquery做轮播图**，在**尾页跟首页切换时出现错误**。
---- 按照滚动到最后一张图，再将ul的left改为首页的值，但是会出现从尾页向左滚动到首页的情况，而不是直接就显示首页的图，怎么让最后一个图直接到首页？
没有视频，如下图所示，不是直接切换到首页的图，而是从右边滑动到首页

$(function(){
    var bannerInterval,n;
    var bannerWidth = $('.jd_banner').width();
    //  当滚动栏滚动时，开始从透明变成红色背景。滚动距离为banner的高度
    var bannerHeight = $('.jd_banner').height();
    //  给banner追加两个节点，用于 向左，向右滚动banner 
    $('.jd_bannerImg>li:eq(0)').clone().appendTo('.jd_bannerImg');
    $('.jd_bannerImg>li:eq(7)').clone().insertBefore('.jd_bannerImg>li:eq(0)');
// banner移动函数
    function bannerMove(){
        // 因为首页前添加了一个最后一页的节点用于向左滚动事件，所以n取值为1；
        n = 1;
        bannerInterval = setInterval(function(){
                // 首页展示位置为 负的 一个图片的宽度
                $('.jd_bannerImg').animate({'left':-n*bannerWidth},500);
                    n++;
                    setTimeout(function(){
                        if(n == 10){
                                                   // 一起共有10张图片 如  最后一张 第一张 第二章 。。。 最后一张 第一张
                            //  此时需要切换第一张，
                                                     //  问题在这里，本来应该直接到-bannerWidth ，但是出现从尾页滚动到首页问题
                            $('.jd_bannerImg').css({'left':-bannerWidth});
                            n = 1;
                        }
                    },500)
        },1000)
    }
    bannerMove();
})

setTimeout的时间和animate的时间一样了，可能导致 $('.jd_bannerImg').css({'left':-bannerWidth})被 $('.jd_bannerImg').animate({'left':-n*bannerWidth},500);给覆盖了， 处理方法只要把setTimeout的执行时间大于animate时间百十来毫秒的就行了，比如setTimeout时间设置成600

https://blog.csdn.net/github_39532240/article/details/79260362

            $(function() {
                dingshiqi();
                var f;
                var index = 0;
                $(function(){
                    $(".point").eq(0).css("background-color","white")
                })
                function dingshiqi(){
                    f=setInterval(function(){
                        if(index==4){
                            index=0;
                            $(".swiper-item").eq(index).show().siblings().hide();
                        }else{
                            index++;
                            $(".swiper-item").eq(index).show().siblings().hide();
                        }
                    },100000)
                }
                $(".swiper-left").click(function() {
                    clearInterval(f);
                    if (index == 0) {
                        index = 4;
                        $(".swiper-item").eq(index).show().siblings().hide();
                        $(".point").eq(index).css("background-color", "white").siblings().css("background-color", "")
                        dingshiqi();
                    } else {
                        index--;
                        $(".swiper-item").eq(index).show().siblings().hide();
                        $(".point").eq(index).css("background-color", "white").siblings().css("background-color", "")
                        dingshiqi();
                    }
                })
                $(".swiper-right").click(function() {
                    clearInterval(f);
                    if (index == 4) {
                        index = 0;
                        $(".swiper-item").eq(index).show().siblings().hide();
                        $(".point").eq(index).css("background-color", "white").siblings().css("background-color", "")
                        dingshiqi();
                    } else {
                        index++;
                        $(".swiper-item").eq(index).show().siblings().hide();
                        $(".point").eq(index).css("background-color", "white").siblings().css("background-color", "")
                        dingshiqi();
                    }
                })
                $(".point").click(function() {
                    clearInterval(f);
                    var indexx = $(this).index();
                    index = indexx;
                    $(".swiper-item").eq(index).show().siblings().hide();
                    $(".point").eq(index).css("background-color", "white").siblings().css("background-color", "")
                    setInterval(f)
                })

            })