小粋空間  -  a cheap joke and a play on words site

「サイドメニューの折りたたみ」でメニューリスト別に状態保持を設定する

「メニューリスト別に折りたたみ状態の保持を設定できないでしょうか」というご要望を頂きましたので、折りたたみスクリプトを修正し、メニューリスト別に状態保持を設定できる（厳密には無効化する）ようにしました。

１．概要

改めて説明致しますと、当サイトで配布しているメニューリストの折りたたみスクリプト menufolder.js には、リストの開閉状態をクッキーを利用して保持し、ブラウザ再起動・ページリロードや他のページにジャンプした際に同じメニューリストがある場合等、前回と同じ状態で表示するという機能があります。

これまでも menufolder.js の設定をカスタマイズすることで状態保持を無効にすることができましたが、スクリプト単位でしか有効・無効を設定できなかったため、今回の改修によりメニューリスト単位で設定できるようにしました。

新しいスクリプトをご利用になる場合、下記の download のリンクよりスクリプトのページにジャンプし、最新版の menufolder.js をダウンロードしてください。

download

２．メニューリストの状態保持を無効にする

ここではエントリーリストを例にします。下のリストはこれまでの設定内容です。

<div class="sidetitle" id="entryname">
Recent Entries
</div>
<div class="side" id="entrylist">
<MTEntries lastn="10">
<a href="<$MTEntryPermalink$>" title="e<$MTEntryID$>"><$MTEntryTitle$></a><br />
</MTEntries>
</div>
 
<script type="text/javascript">
FoldNavigation('entry','on',false);
</script>

このリストの折りたたみ状態を保持したくない場合は、起動部分のスクリプト（赤色）の FoldNavigation の部分を FoldNavigationStateless（青色部分） に書き換えてください。

<div class="sidetitle" id="entryname">
Recent Entries
</div>
<div class="side" id="entrylist">
<MTEntries lastn="10">
<a href="<$MTEntryPermalink$>" title="e<$MTEntryID$>"><$MTEntryTitle$></a><br />
</MTEntries>
</div>
 
<script type="text/javascript">
FoldNavigationStateless('entry','on',false);
</script>

状態を保持する場合はこれまでの設定と変わりません。

３．全てのメニューリストの状態保持をまとめて無効にする

既存機能ですが、全てのメニューリストの状態保持を無効にしたい場合は menufolder.js の中ほどにある

//--------------------------------------------------------
// 状態保持用設定データ
//--------------------------------------------------------
 
// 状態保持フラグ
// 有効にする：true
// 無効にする：false
var holdState = true;

の赤色部分を

var holdState = false;

に変更してください。
起動関数は FoldNavigation で構いません。