スライドトグル

特定の箇所をクリックした際に、指定した要素の表示／非表示をスライド効果で切り替えるトグル機能です。（Ver. 1.2.1より）初期状態は非表示状態です。

通常は隠しておき、クリックした時に表示されるようなものに使用できます。

デモ

詳細を表示する

詳細のテキストです。詳細のテキストです。詳細のテキストです。詳細のテキストです。

デフォルト設定

この機能の設定は、/js/config.jsの以下の箇所にあります。設定を変更する場合は、適用しているテーマ内にJavaScriptファイルを別途作成してください。詳しくは「組み込みJSについて：設定を編集する」を参照してください。

toggleHeadClassSuffix  : 'toggle-head',
toggleBodyClassSuffix  : 'toggle-body',

---

---

設定のカスタマイズ

config.jsのデフォルトの設定からカスタマイズする場合、JSファイルに下記のように記述します。

ACMS.Ready(function(){
  ACMS.Config.toggleHeadClassSuffix = 'js-sample-toggle-head';
  ACMS.Config.toggleBodyClassSuffix = 'js-sample-toggle-body';
});

HTMLの編集

例）toggleHeadClassSuffixで「toggle-head」、toggleBodyClassSuffixで「toggle-body」と指定した場合

<p class="toggle-head">詳細を表示する</p>
<p class="toggle-body">詳細のテキストです。詳細のテキストです。詳細のテキストです。詳細のテキストです。</p>

表示／非表示を切り替えるときにクリックする要素は、アンカーリンク（）ではなくても動作します。

---