Анимации jQuery: проблемы с отменой анимации фиксированного div

#jquery #animation #jquery-animate

#jquery #Анимация #jquery-анимировать

Вопрос:

http://jsfiddle.net/HLw9U/

При загрузке документа нижний колонтитул перемещается наверх.

Я хочу, чтобы при нажатии на документ нижний колонтитул скользил вниз до самого низа.

Но, увы, он просто остается наверху.

Что за обман здесь происходит?

РЕДАКТИРОВАТЬ: добавлен код

 function slide_footer_to_top(){
    $j(".footer").animate({
        opacity: 0,
        bottom: "20%",
    }, 200, function(){
        // finished
    }).animate({
        opacity: 1,
        top: "0%",
    }, 600, function(){
        // finished
    });
}

function slide_footer_to_bottom(){
    $j(".footer").animate({
        opacity: 0,
        top: "inherit",
        bottom: "100%",
    }, 300, function(){
        // finished
    }).animate({
        opacity: 1,
        top: "inherit",
        bottom: "0%",
    }, 500, function(){
        // finished
    });
  

Ответ №1:

Вы устанавливаете верхние и нижние значения одновременно — верхнее значение переопределяет любое нижнее значение, а div остается сверху. Попробуйте что-то вроде:

 function slide_footer_to_bottom(){
    $j(".footer").animate({
        opacity: 0,
        top: "90%",
    }, 300, function(){
        // finished
    }).animate({
        opacity: 1,
        top: "90%",
    }, 500, function(){
        // finished
    });
  

или сбросьте верхнее значение:

 $j(".footer").css('top', '');