Question

所以我正在创建一个脚本，在我的网站上添加浮动页面的云。但是，如this example所示，第一个云的外观被setTimeout spawn_cloud_loop延迟（10-12秒）。有没有办法迫使第一个云立即添加没有延迟。我尝试在add_cloud();之前添加spawn_cloud_loop();，但延迟仍然存在。可以在https://github.com/JordanAdams/jordanadams.github.com找到整个项目，在js/clouds.js找到云效果的代码。

约旦

Answer 1

您的clouds.js脚本包含在头部中，然后立即运行add_cloud();。这意味着您创建了一个新的云并尝试将其附加到不存在的“云”div中，因为它还没有被解析过。第二个和后续的云创建正常，因为spawn_cloud_loop()函数有如此长的延迟，以至于文档已被当时解析。

您需要将clouds.js脚本包含在页面源中“clouds”div下面的某处移动，或者将add_cloud();调用放在文档就绪处理程序中，这样才能在执行之后执行“clouds”div已被解析：

$(document).ready(function(){
    add_cloud();
    spawn_cloud_loop();
    clean_up();
});

注意：如果您在设置超时之前修改了add_cloud()以致电spawn_cloud_loop()，则不需要对add_cloud()进行初始调用：

function spawn_cloud_loop () {
    add_cloud();
    setTimeout(spawn_cloud_loop, rand(10000, 12000));
}

（当然，您仍需要准备好文件中的spawn_cloud_loop()。）

此外，如果您在动画结束时立即从jQuery .animate() method's完整回调中删除每个云，则根本不需要clean_up()进程：

cloud.animate({ left: window.screen.width+100 },
              50000,
              'linear',
              function(){ $(this).remove(); });

停止setTimeout延迟首次运行

1 个答案: