jQuery dotdotdot в аккордеонном меню

Question

Поэтому у меня есть набор аккордеонов, которые я использую, чтобы показывать и скрывать дополнительный контент. Я использую janu.animate(), чтобы сделать это (хорошо в этом случае это использует скорость, но по существу то же самое). Закрытая высота показывает несколько строк текста (высота: 95 пикселей), а открытая высота анимируется по высоте: auto, (вроде как, есть небольшая хитрость для получения автоматической высоты). И то же самое наоборот, он оживляет до закрытой высоты.

Моя проблема в том, что я пытаюсь добавить jQuery dotdotdot http://dotdotdot.frebsite.nl/ чтобы закрытые были обрезаны. Конечно, я могу заставить это работать под нагрузкой, то есть закомментированную часть вверху.

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

Вот ссылка на кодовый блок тоже: http://codepen.io/anon/pen/pvaroR

jQuery(function($){

  //$('.accordion-content').dotdotdot();

  $('.accordion-title').on('click', function(){
    var content = $(this).next();

    if ($(this).parent().hasClass('open')) {
      content.velocity({ 'height' : 95 });
      $(this).parent().removeClass('open').addClass('closed');
    } else {

      // Sets height to auto quickly
      content.css({ 'height' : 'auto' });

      // Store that value in a variable
      var contentHeight = content.height();

      // Sets height back to "closed" height
      content.css({ 'height' : 95 });

      $(this).parent().removeClass('closed').addClass('open');

      // animates to strored variable height
      content.velocity({ 'height' : contentHeight });

    }
  });
});

Answer 1

dotdotdot Плагин не позволяет легко вернуть исходный контент в исходную форму. Я использовал комбинацию originalContent событие, а затем повторная инициализация dotdotdot на аккордеонном содержании.

Псевдокод выглядит так:

when title is clicked {
    if content was open {
        call .dotdotdot on content
        animate height down to fit content
    } else content was closed {
        get original content and put it back
        get new height, set back to lower height, animate to regular height
    }
}

Вы можете просмотреть обновленный CodePen здесь: http://codepen.io/anon/pen/XJZaYP

Обновлен CodePen с .dotdotdot() вызывается в velocity обратный вызов: http://codepen.io/anon/pen/myXzwW