Проблемы с обратным вызовом анимации Jquery

Question

Я пытаюсь создать простую карусельную анимацию с помощью jQuery. В каждый момент есть 3 просматриваемых изображения с кнопками, нажимаемыми на каждой стороне, чтобы идти вперед или назад. Центральное изображение увеличивается на 30 пикселей, чтобы получить выдающееся положение. При нажатии одной из кнопок центральное изображение должно выпасть вниз, тогда все три изображения перемещаются вместе влево или вправо.

Начальная анимация вверх и вниз работает, но при обратном вызове никакая другая анимация не будет работать. Если я жестко закодирую направление в них, то работает только один из них. Что-то не так с моим текущим кодом или подходом?

ctr_right.click(function() { carouselAnimate("right") });
ctr_left.click(function() { carouselAnimate("left") });

function carouselAnimate(direction) {
    var offset = img_width + img_offset;
    img_focus.animate({"top": "+="+focus_offset}, "slow", function() {
        img_left.animate({direction: "-="+offset}, "slow"); 
        img_focus.animate({direction: "-="+offset}, "slow");    
        img_right.animate({direction: "-="+offset}, "slow");    
    });

};

Answer 1

Я думаю, что направление всегда должно быть «левым», и исходя из того, что я предполагаю направление, вы захотите добавить или удалить смещение. Я не думаю, что переключение между установкой положения влево / вправо - не очень хороший подход.

Что мне менее понятно, так это то, почему вы по-разному анимируете несколько вещей. Разве это не сработало бы так же хорошо:

ctr_right.click(function() { carouselAnimate("right") });
ctr_left.click(function() { carouselAnimate("left") });

function carouselAnimate(direction) {
    var offset = img_width + img_offset;
    img_focus.animate({"top": "+="+focus_offset}, "slow", function() {
        $(img_left, img_focus, img_right).each(function(){
           $(this).animate({direction: "-="+offset}, "slow");
        }); 
    });

};

Последняя мысль; Если приведенное выше не отвечает на ваш вопрос, посмотрите в очередь: false в опциях анимации jquery.

http://api.jquery.com/animate/#animate-properties-options