Javascript横幅幻灯片在pageload上相互重叠

我的JavaScript横幅有问题。我只想让第一张幻灯片出现在页面加载上。当前，横幅跳到最后一张幻灯片一秒钟，然后跳回到第一张幻灯片。这是我的JavaScript。我在这方面是新手，我一直在互联网上搜索，运气不好，希望能得到帮助。谢谢

var jqb_vCurrent = 0;
var jqb_vTotal = 0;
var jqb_vDuration = 6000;
var jqb_intInterval = 0;
var jqb_vGo = 1;
var jqb_vIsPause = false;
var jqb_tmp = 20;
var jqb_title;
var jqb_imgW = 680;
var jqb_imgH = 200;

jQuery(document).ready(function() { 
jqb_vTotal = $(".jqb_slides").children().size() -1;
$(".jqb_info").text($(".jqb_slide").attr("title")); 
jqb_intInterval = setInterval(jqb_fnLoop, jqb_vDuration);

//Horizontal
$("#jqb_object").find(".jqb_slide").each(function(i) { 
    jqb_tmp = ((i - 1)*jqb_imgW) - ((jqb_vCurrent -1)*jqb_imgW);
    $(this).animate({"left": jqb_tmp+"px"}, 500);
});


$("#btn_pauseplay").click(function() {
    if(jqb_vIsPause){
        jqb_fnChange();
        jqb_vIsPause = false;
        $("#btn_pauseplay").removeClass("jqb_btn_play");
        $("#btn_pauseplay").addClass("jqb_btn_pause");
    } else {
        clearInterval(jqb_intInterval);
        jqb_vIsPause = true;
        $("#btn_pauseplay").removeClass("jqb_btn_pause");
        $("#btn_pauseplay").addClass("jqb_btn_play");
    }
});
$("#btn_prev").click(function() {
    jqb_vGo = -1;
    jqb_fnChange();
});

$("#btn_next").click(function() {
    jqb_vGo = 1;
    jqb_fnChange();
});
});

function jqb_fnChange(){
clearInterval(jqb_intInterval);
jqb_intInterval = setInterval(jqb_fnLoop, jqb_vDuration);
jqb_fnLoop();
}

function jqb_fnLoop(){
if(jqb_vGo == 1){
    jqb_vCurrent == jqb_vTotal ? jqb_vCurrent = 0 : jqb_vCurrent++;
} else {
    jqb_vCurrent == 0 ? jqb_vCurrent = jqb_vTotal : jqb_vCurrent--;
}


$("#jqb_object").find(".jqb_slide").each(function(i) { 
    if(i == jqb_vCurrent){
        jqb_title = $(this).attr("title");
        $(".jqb_info").animate({ opacity: 'hide', "left": "-50px"}, 250,function(){
            $(".jqb_info").text(jqb_title).animate({ opacity: 'show', "left": "0px"}, 500);
        });
    } 


    //Horizontal Scrolling
    jqb_tmp = ((i - 1)*jqb_imgW) - ((jqb_vCurrent -1)*jqb_imgW);
    $(this).animate({"left": jqb_tmp+"px"}, 500);


});


}

---

也许您不应该为文档上的每个jqb_对象设置动画。jqb_幻灯片元素。准备好了吗

编辑

而不是

//Horizontal
$("#jqb_object").find(".jqb_slide").each(function(i) { 
    jqb_tmp = ((i - 1)*jqb_imgW) - ((jqb_vCurrent -1)*jqb_imgW);
    $(this).animate({"left": jqb_tmp+"px"}, 500);
});

试一试

如果您希望最后一张幻灯片以自己的标题出现在页面加载中，请更改jqb_vCurrent index：

---

我试过了，但没能成功。我被这件事缠住了。因为我发布了这篇文章，所以我添加了一些其他代码来阻止我遇到的动画累积问题。你让我把密码放在哪里对不起，被切断了。因此，代码片段oc de现在看起来是这样的：非常感谢您回复我。所以我输入了你建议的代码，但我仍然无法让它工作。我得到一个语法错误。我做错什么了吗？代码让我很疯狂$jqb_object.find.jqb_slide:first.animate{left:jqb_tmp+px}，500；{jqb_tmp=i-1*jqb_imgW-jqb_vCurrent-1*jqb_imgW；$this.stop.animate{left:jqb_tmp+px}，500；}；我不是绝对确定这个解决方案，但请检查我的编辑answer@h4bo我快到了。非常感谢。现在，最后一张幻灯片会自动出现在pageload上，但我可以解决这个问题。我还有一个小问题。在每张幻灯片上，我在每张幻灯片的div中都有标题标签，它作为标题显示在每张相应幻灯片的底部。现在，在页面加载中，最后一张幻灯片首先出现，并带有第一张幻灯片的标题。如果有帮助的话，我可以发布html代码。再次感谢。你是个救生员。

//Horizontal
i = 1;
jqb_tmp = ((i - 1)*jqb_imgW) - ((jqb_vCurrent -1)*jqb_imgW);
$("#jqb_object").find(".jqb_slide:first").animate({"left": jqb_tmp+"px"}, 500);

jqb_vCurrent = jqb_vTotal;