写在jQuery的一个全球性的动画队列(Writing a global animation que

添加的动画序列，以使用jQuery单个dom元素非常容易。 jQuery的排队一切行动很好地为我和我基本上没有做任何事情。

然而制作动画的序列在多个元件（例如pictureDiv淡出，然后demographicsDiv淡入）更难。我写了一个插件类的东西，使其更容易如下：

var something.createAnimationQueue = function () {

    // jQuery queues up animations on each dom element (/ jquery object)
    // We want to queue up animations over different dom elements so 
    // use a jquery object on a blank element
    var animationQueue = $({});

    return {
        add: function (animationFunctionContext, animationFunction) {
            var args = $.makeArray(arguments).slice(2);
            animationQueue.queue(function (next) {
                $.when(animationFunction.apply(animationFunctionContext, args)).done(next)
            })
        }
    }
}

这也是正是如此使用

        var animationQueue = something.createAnimationQueue();

        animationQueue.add(pictureDiv, pictureDiv.fadeOut, 'slow');
        animationQueue.add(demographicsDiv, demographicsDiv.fadeIn, 'slow');

我的问题是：

1）我错过了什么？是否有这样做，我不知道更简单的方法。

2）如果没有，有没有办法避免将pictureDiv和pictureDiv.fadeOut到animationQueuer？（我想，不能想一）

谢谢！

由于您使用。适用和重新分配this ，你可以简单地使用

var animationQueue = something.createAnimationQueue();

animationQueue.add(pictureDiv, $.fn.fadeOut, 'slow');
animationQueue.add(demographicsDiv, $.fn.fadeIn, 'slow');

如果你真的想，你可以把它转换成字符串：

var something.createAnimationQueue = function () {

    // jQuery queues up animations on each dom element (/ jquery object)
    // We want to queue up animations over different dom elements so 
    // use a jquery object on a blank element
    var animationQueue = $({});

    return {
        add: function (animationFunctionContext, method) { // <----
            var args = $.makeArray(arguments).slice(2);
            animationQueue.queue(function (next) {
                $.when($.fn[method].apply(animationFunctionContext, args)).done(next) // <----
            })
        }
    }
}

var animationQueue = something.createAnimationQueue();

animationQueue.add(pictureDiv, 'fadeOut', 'slow'); // <----
animationQueue.add(demographicsDiv, 'fadeIn', 'slow'); // <----

但是请注意，这不能用于除现在只是动画的更多。你可以用它返回一个承诺的对象，如阿贾克斯，.POST，不用彷徨，.getJSON等，如果你使用像你原来有任何的jQuery方法使用。