Javascript 循环非jQuery动画工作正常,直到循环回到起点

Javascript 循环非jQuery动画工作正常,直到循环回到起点,javascript,velocity.js,Javascript,Velocity.js,尝试通过一组滑动帧循环一个标题特性 “幻灯片”分区 在第二次从#hs1过渡到#hs2之前,一切都很顺利,在Velocity(旧幻灯片,时,我从Velocity中得到TypeError:L未定义,动画和回调不会触发。在脚本的哪一行触发该错误?是Velocity吗(旧幻灯片,line?@CertainPerformance yap!编辑问题以添加…您的幻灯片选择器是[“#hs1”、“#hs2”、“#hs3”],但所提供的代码中未显示任何内容。@CertainPerformance Aha。简化htm

尝试通过一组滑动帧循环一个标题特性

“幻灯片”分区


在第二次从#hs1过渡到#hs2之前,一切都很顺利,在
Velocity(旧幻灯片,
时,我从Velocity中得到
TypeError:L未定义,动画和回调不会触发。

在脚本的哪一行触发该错误?是
Velocity吗(旧幻灯片,
line?@CertainPerformance yap!编辑问题以添加…您的幻灯片选择器是
[“#hs1”、“#hs2”、“#hs3”]
,但所提供的代码中未显示任何内容。@CertainPerformance Aha。简化html时出错…问题已更新。您的问题必须在实际代码中,而不是在您简化的代码中。
:在此处发布您的实际代码
<div class = "homeSlideHolder">
    <div class = "slide" id = "hs1" style="left: 0px;">
        <img src="img1.jpg">
    </div>
    <div class = "slide" id = "hs2" style="left: 0px;">
        <img src="img2.jpg">
    </div>
    <div class = "slide" id = "hs3" style="left: 0px;">
        <img src="img3.jpg">
    </div>
</div>
    function aniInit(){
        var slides = ["#hs1", "#hs2", "#hs3"];

        setTimeout(function(){aniInst(slides[0], slides)}, 6300);
    } 

    function aniInst(oldSlideID, slides){
        var oldSlide = document.querySelectorAll(oldSlideID);

        var nextSlideID = nextPrep(oldSlideID, slides);
        var nextSlide = document.querySelectorAll(nextSlideID);

        Velocity(oldSlide, {left: "-100%"}, 1000, function(){
            //give old slide a z-index of 0 and reset style.left 
            oldSlide[0].classList.add("SZIZero");
            oldSlide[0].classList.remove("SZIMax");
            oldSlide[0].style.left = 0; 
            //give next slide a z-index of 2
            nextSlide[0].classList.add("SZIMax");
            nextSlide[0].classList.remove("SZINext");
            setTimeout(function(){aniInst(nextSlideID, slides)}, 6300);
        });
    }

    function nextPrep(oldSlideID, slides){

        if (typeof slides[slides.indexOf(oldSlideID)+1] === "undefined"){
            var nextSlideID = slides[0];
        } else {
            var nextSlideID = slides[slides.indexOf(oldSlideID)+1];
        }

        var nextSlide = document.querySelectorAll(nextSlideID);
        //apply z-index of 1 to make sure next slide
        // is visible as the old one above it slides away
        nextSlide[0].classList.add("SZINext"); 
        nextSlide[0].classList.remove("SZIZero");

        return nextSlideID;
    }