jquery анимация запускается в первый раз, но не после смены классов?

Question

Следующая анимация работает именно так, как мне нужно, при первом вызове функции, но после изменения функции классы работает только анимация непрозрачности, когда вы вызываете функцию, а слайд влево даже не пытается выполнить. Я новичок в Jquery, поэтому я не уверен, из-за чего одна анимация не работает, а другая работает нормально ... Любые советы очень ценятся. Пример можно найти по адресу www.digitalbrent.com/lab - нажмите на заполнить, затем нажмите на уменьшение.

function slider_minus(){

    $('.left_slot').animate({
        left: '50px'        //only works on first function call
    },300);

    $('.middle_slot').animate({
        left: '50px'        //only works on first function call
    },300, function(){
         $('.middle_slot').attr('class','right_slot')
         $('.left_slot').attr('class','middle_slot')
    });

    $('.right_slot').animate({
        opacity: 0,         //works correctly every time
        left: '50px'        //only works on first function call
    },300);
}

Answer 1

Поскольку вы устанавливаете left:50px, то есть он не выглядит анимированным, как только у него осталось 50 пикселей.

Попробуйте

left: "+=50"

Это заставит ваш div перемещаться на 50 пикселей влево при каждом вызове, независимо от того, где он сейчас находится