jquery - JQuery异步图片幻灯片预加载

Question

我正在使用 JQuery 动画框架编写脚本。在这种情况下，我需要一系列不同的动画。当一个新动画开始时，我需要更改页面的背景图像。

动画框架（称为 JSTween）提供以下回调：

onStart: function () {},
onStop: function () {}

我正在寻找以下伪代码的 JQuery 实现：

onStart: function () {
    load new background;
}

onStop: function () {
    // This animation has ended, about four seconds have passed
    on new background loaded: {
       // Change background
    }

    // Start new animation async
}

我一直在寻找$.when和类似的工具，但我不知道如何正确使用它们。

Answer 1

您应该实现几个类似$.when. 基本上，您注册一个在函数的运行时上下文中运行的onStart函数：

var background_callback;

var loadNewBackground = function() {
  background_callback();
}

var onBackgroundLoaded = function (callback) {
  background_callback = callback;
}

您编辑的代码将是：

onStart: function () {
    // load new background;
    loadNewBackground();
}

onStop: function () {
    // This animation has ended, about four seconds have passed
    onBackgroundLoaded(function() {
       // Change background
    });

    // Start new animation async
}