jQuery：用一个功能在不同方向上为两个图像设置动画答案

【问题标题】：jQuery: Animating two images with one function in different directionsjQuery：用一个功能在不同方向上为两个图像设置动画
【发布时间】：2011-04-03 09:24:41
【问题描述】：

我正在尝试使用单个函数为两个不同的图像设置动画。我遇到的问题是其中一个图像需要为左侧属性设置动画，而另一个需要为右侧设置动画。我尝试了一些不同的事情，但这是我所得到的：

    $(document).ready(function(){
        var puppy = $('.puppy'),
            woman = $('.woman-smiling');

        fadeImages(puppy, "left");
        fadeImages(woman, "right");
    });

    function fadeImages($image, $direction){
        $image.delay(500)
            .css({
                visibility: "visible",
                display: "none"
            }).animate({
                opacity: "show",
                $direction: "0px"
            }, 1750);
    }

延迟和衰落工作正常，但方向是混乱的。蒂亚！！！

【问题讨论】：

标签： jquery css positioning jquery-animate

【解决方案1】：

我认为你不能像现在这样使用 $direction。也许这会起作用：

function fadeImages($image, $direction){

    var properties = new Object();
    properties['opacity'] = "show";
    properties[$direction] = "0px";

    $image.delay(500)
        .css({
            visibility: "visible",
            display: "none"
        }).animate(properties, 1750);
}

【讨论】：

【解决方案2】：

试试这个：

var config = { opacity: "show" };
config[$direction] = "0px;"

.animate(config, , 1750);

你所拥有的东西不起作用，因为在这种情况下它使用 $direction 作为 KEY，而不是用它代替你的变量值。

【讨论】：