jQuery: анимация двух изображений с одной функцией в разных направлениях

Question

Я пытаюсь использовать одну функцию для анимации двух разных изображений.У меня проблема в том, что одно из изображений должно анимировать левый атрибут, а другое - правое.Я попытался сделать несколько разных вещей, но это все, что я получил:

    $(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);
    }

Задержка и замирание работают нормально, но направление - это то, что перепутано.ТИА !!!

Answer 1

Я не думаю, что вы можете использовать направление $, как вы делаете. Возможно, это сработает:

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);
}

Answer 2

Попробуйте это:

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

.animate(config, , 1750);

То, что у вас есть, не работает, потому что оно использует $direction в качестве КЛЮЧА в этом случае, а не подставляет его для значения вашей переменной.