Question

我对网络开发以及整个html，css，js都很陌生，但我敢说我是一名称职的程序员，所以我至少应该知道什么不能解决我的代码问题。但事实并非如此，我现在感到非常愤怒，我不想留下来。

我的目标是以与电源点演示相同的方式创建一个完整的在线课程：可点击的对象，使事物出现并通向其他一些页面;和按顺序出现的图像动画。

我之前没有遇到任何问题＆＃34;幻灯片＆＃34;我已经转录到一个网页，但最后一个让我感到头痛。我的页面主要包含<img>标记中包含的图片，所有图片都包含正确的id和一个或多个class值（class="class1 class2"）。定位为position: absolute;样式，我将它们放在我想要的位置。接下来是动画，这是我处理它的方式：

当文档完成加载时，<body class="contentBody" onload=...>调用一个方法：myLocalInit();并使用jQuery函数处理动画。以下是关于它的完整代码：

function myLocalInit(){
        disablePNButtons();
        hideAll('.part');
        lowerClass('.animar',50);
        slideUpAll();
    }
function slideUpAll(){
        $(".identifica").animate({
            top: '-=50px',
            opacity: '1'
        }, 400);
        setTimeout(slideUpRest(),400);
}
function slideUpRest(){
        $(".identifica").animate({
            top: '-=50px',
            opacity: '1'
        }, 400, function(){$('#preguntas').animate({
            top: '-=50px',
            opacity: '1'
        }, 400, function(){ $('#hogar').animate({
            top: '-=50px',
            opacity: '1'
        }, 400, function(){ $('#negocio').animate({
            top: '-=50px',
            opacity: '1'
        }, 400, function(){ $('#holabank').animate({
            top: '-=50px',
            opacity: '1'
        }, 400, function(){ $('#agrobank').animate({
            top: '-=50px',
            opacity: '1'
        }, 400 function(){ $('#vr').animate({
            opacity: '1'
        }, 400)})})})})})});
}
function hideAll(class1){
        $(class1).css('opacity','0');
}

function lowerClass(class1,height){
        $(class1).css('top', '+='+height+'px');
}
function disablePNButtons(){
        UDUTU_API.gblPreviousButton.btnEnabled(false);
        UDUTU_API.gblNextButton.btnEnabled(false);
}

<body>最终看起来像这样：<body class="contentBody" onload="myLocalInit();">

然后，当加载页面时，myLocalInit()内的所有方法都不起作用，这很奇怪。但它得到了更多！如果我从myLocalInit()中取出这些方法并将其放入onload事件（<body class="contentBody" onload="disablePNButtons();hideAll('.part');lowerClass('.animar',50);slideUpAll();">），它们会生效到slideUpAll()（我通过无聊{{1}发现了这一点调试）。

我真的不知道这个特定页面出了什么问题，我已经完成了与前7页类似的编程，并且运行良好。请，请！我请求大家，大师们，请赐教我为什么这不起作用T_T

Answer 1

这可能/可能无法解决您的问题。如果不调试代码，很难确定精确的解决方案。只是阅读你的问题并没有让我想到任何明显的问题。因此，我可以提供一些可以解决问题的良好实践，并使您的代码更可靠。

请将您的功能放在文档就绪块中：

// A $( document ).ready() block.
$( document ).ready(function() {
    console.log( "ready!" );
    // All your functions

    myLocalInit();
});

然后将脚本标记从标题移动到结尾（仅在结束</body>标记内。

这使得javascript非阻塞，并且只在DOM准备好后才加载。

您可以做的下一件事是，也可以在文档就绪块的末尾调用myLocalInit();，如上所示，并将其从body.onload中删除。一旦加载DOM，它仍然会运行。

如果这些更改解决了问题，请告诉我。

Answer 2

好吧，猜猜看，我显然错过了管理顺序动画的阴险代码中的逗号,。最后一个回调函数未与400参数T_T

分开

整个上午一个人...非常感谢所有帮助我并提供有用建议的人们。）

为什么图片没有显示？

2 个答案: