ac.inc.php

サマリjQueryを使ったアコーディオン (折りたたみ) プラグイン
リビジョン1.6
対応バージョン1.5.3
投稿者kanateko
投稿日2021-07-07 (水) 22:24:43

指定範囲を折りたたんで開閉可能にするプラグイン。スライドアニメーション付き。プラグイン名は "accordion" から。 ページの見出しでの折りたたみ、リストや表組みの中での使用が可能なほか、複数を同時に開閉するボタンの設置などができます。 動作にjQuery、装飾としてFont Awesomeを使用しています*1

ダウンロード & インストール

必要ファイルのダウンロードとインストール手順については以下のページを参照してください。

https://jpngamerswiki.com/?339186a834

詳しい使い方や表示例なども掲載しています。

プラグインの仕様

使い方

アコーディオンの見出しの指定がない場合は自動的に "..." が表示されます。

ブロック型

#ac([アコーディオンの見出し][オプション]){{
折りたたむ内容
}}

インライン型

&ac([アコーディオンの見出し][オプション]){折りたたむ内容};

複数開閉ボタンの設置

#ac(all) //ボタン
// ボタンより下、同階層のアコーディオンが対象。
// 次のボタンや#ac(end)がある場合はそのボタンまでが対象。
#ac{{...
#ac{{...
#ac{{...
// ここまで
#ac(end) //必要に応じて設置。無くても問題なし。

オプション

h
直上の要素 (兄弟要素) をアコーディオンの見出しとして使用します。主にページの見出しを使ってアコーディオンを作成する際に使用します。
open
折りたたみ部分を開いた状態で表示します。
alt
折りたたんでいる際にその旨を示す文章を表示します。hと併用を推奨。
all
複数のアコーディオンを同時に開閉するためのボタンを設置します。複数設置可能で、制御範囲はボタンからボタンまで、もしくは#all(end)があるところまで。どちらもない場合は一番下までが制御範囲です。
end
allオプションで設置したボタンの制御範囲の終了位置を作成します。一番下まで対象にする場合は特に必要ありません。

※hオプションで他の要素をアコーディオンの見出しに指定した際、既存の疑似要素(before, after)と開閉用アイコンが衝突して正常に表示されなくなるバグがあったため、v1.6で修正。

ライセンス

GPL v3


*1 Font Awesomeが無くてもソースの一部を変更すれば動作可能

トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2021-09-19 (日) 12:04:38
Site admin: PukiWiki Development Team

PukiWiki 1.5.3+ © 2001-2020 PukiWiki Development Team. Powered by PHP 5.6.40-0+deb8u12. HTML convert time: 0.422 sec.

OSDN