JQuery UI слайд анимация с фиксированной высотой работает только в первый раз

Question

У меня есть функция поиска, загружающая результаты с помощью ajax и показывающая результаты с использованием слайд-анимации.Работает отлично!Но, к сожалению, только в первый раз, во второй раз (и далее) анимация скольжения не работает.

Пожалуйста, посмотрите здесь: http://jsfiddle.net/e4sQh/4/

Поиск не выполнентам и никакие ajax-данные не загружаются, но вы поймете смысл.Спасибо за вашу помощь!

Answer 1

Это потому, что вы установили высоту 0 внутри вашей проверки if (которая верна только в первый раз) здесь:

  // get the original height
  if( !height ){
    // get original height
    height = $el.show().height();
    // update the height
    $el.data("originalHeight", height);
    // if the element was hidden, hide it again
    if( !visible ) $el.hide().css({height: 0});
  }

Его нужно вынести наружу так:

  // get the original height
  if( !height ){
    // get original height
    height = $el.show().height();
    // update the height
    $el.data("originalHeight", height);
  }
  // if the element was hidden, hide it again
  if( !visible ) $el.hide().css({height: 0});

Таким образом, он скрывает каждый раз, вы можете проверить здесь .

Answer 2

Я думаю, что эта часть неправильная

if( !height ){
    // get original height
    height = $el.show().height();
    // update the height
    $el.data("originalHeight", height);
    // if the element was hidden, hide it again
    if( !visible ) $el.hide().css({height: 0});
  }

Вы показываете элемент, чтобы получить его высоту, поэтому он не скользит, когда он виден!

Вы должны использовать метод css(), чтобыset position:absolute, visibility:hidden и display:block.

В любом случае JQuery предоставляет метод, который заменяет вашу функцию, посмотрите на слайды

Answer 3

Заменить

slideToggle('#results',true); // inside hideLoading()

на

content.slideDown();