もっと見るをvelocity.jsで実装する

more.html

<a href="#" data-slide-trigger="A" data-slide-toggle="true">Aをクリックすると...</a>
<div class="js-slide-target" data-slide-target="A">Aが開きます！</div>

<a href="#" data-slide-trigger="B" data-slide-toggle="false">Bをクリックすると...</a>
<div class="js-slide-target" data-slide-target="B">Bが開きます！クリックしたものはremoveされるぞ</div>

<a href="#" data-slide-trigger="C" data-slide-toggle="true">Cをクリックすると...</a>
<div class="js-slide-target" data-slide-target="C">Cが開きます！</div>

showToggle-velocity.js

/**
 * スライド表示（more）イベント設定
 * 特定のdata属性が付与されたものに対してイベント付与
 * - data-slide-trigger="hoge" をクリックすると
 * - data-slide-target="hoge" に対してスライド処理が走る
 * - data-slide-triggerに、data-slide-toggle="true"が設定されている場合は、Toggle処理をする
 */
var addMoreEvent = function() {
  var $trigger = $('[data-slide-trigger]'),
      $target  = $('[data-slide-target]');

  // 初期設定としてターゲットを非表示に
  // cssで対応する場合は無効に
  $target.hide();

  var clickEventHandler = function() {
    var $self = $(this),
        isToggle = $self.data('slide-toggle') || false,
        targetName = $self.data('slide-trigger'),
        $target = $('[data-slide-target="'+targetName+'"]');

    // Toggleが無ければ表示とトリガー削除を実行
    if (isToggle === false) {
      $self.velocity({
        opacity: 0
      }, {
        duration: 300,
        complete: function() {
          $target.velocity('slideDown', { duration: 300 });
          $self.velocity('slideUp', { duration: 300 });
        }
      });
    }
    // Toggleがあれば再利用できるように
    if (isToggle === true) {
      $self.toggleClass('is-opened');
      if ($self.hasClass('is-opened')) {
        $target.velocity('fadeIn', { duration: 300 });
      } else {
        $target.velocity('fadeOut', { duration: 300 });
      }
    }
    return false;
  };

  $trigger.on('click', clickEventHandler);
};

// document ready後に実行する       
addMoreEvent();

• jquery, velocity.js依存
• data-slide-toggletrueだと、その要素にis-openedクラスも合わせてtoggle
• 読み込み時にjsで消すためガクッとなる

避けるには.js-slide-targetにcssでnoneする（SEO的にはあまりよろしくないので重要なコンテンツは要確認）
またはajaxなどで動的に読み込む（SEO的には多分同上）

スライド表示動作が微妙な場合は、moreボタンのcssをabsoluteにして↓のように

complete: function() {
  $target.velocity('slideDown', { duration: 300 });
  // $self.velocity('slideUp', { duration: 300 });
  $self.remove();
}