サイドバー折り畳み２：動作遅延対策

ようやく修正が一段落しました(^^;ので、「サイドバー折り畳み２」の動作遅延対策について書きたいと思います。

このスクリプトは、折り畳みたいリストより下に設置する必要があるのですが、読み込みに時間がかかるコンテンツがあると、折り畳まれるまでに時間がかかってしまって使いづらくなることがあります。

そこで、そういう重いコンテンツの前と後に合計二回とか、左サイドの一番下＆右サイドの真中＆一番下に合計三回、という風に、複数回に分けて設置できるようになっています。

複数回設置する場合でも本記事にあるコピー＆ペースト用のコードをそのまま数回使っていただければ折り畳み自体は動作するようですが、ちょっとだけ問題が残ってしまいますので、それが気になる場合は以下の方法に沿ってお試し下さい。

具体例から書かせていただくと、このブログでは、三回、つまり、左サイドバーの一番下（マイリスト名「<!-- script-LZ -->」のメモ欄）と、右サイドバーの「MY UTILS」の前（リスト「script-R0」）と一番下（リスト「<!-- script-RZ -->」）の三箇所に分けてスクリプトを書いてあり、それぞれ以下の様な感じになっています。

#このコードは生地作成当時のもので、現在はこうなっていませんが、手法自体は同じです。

◆最初の設置箇所のコード例：
リスト「<!-- @bottom left -->」
（隠れてますが、左の一番下）

<script type="text/javascript" src="http://facet.cocolog-nifty.com/divers/myFunctions01a.js">
</script>
<script type="text/javascript" src="http://facet.cocolog-nifty.com/divers/foldSidebar02c.js">
</script>
<script type="text/javascript">
<!--
foldMark = "-";
unfoldMark = "+";
switchStyle = "float:right;padding:0px;margin:0px;width:1.4em;height:1.4em;line-height:1em;text-align:center;";
labelStyle = "letter-spacing:0em;";
counterPrefix = "";
counterPostfix = "";
counterStyle = "letter-spacing:normal;color:white;margin-left:0.1em";
foldBroadly = true;
//
pattern = "最近の記事|contact|最近のコメント|最近のトラックバック|カテゴリ|バックナンバー|scripts";
makeSwitchesBy(pattern);
//
pattern = "contact|最近のコメント|最近のトラックバック|カテゴリ|バックナンバー|scripts";
foldContentsBy(pattern,"continued"); 
//
pattern = "最近の記事|contact|最近のコメント|最近のトラックバック|カテゴリ|バックナンバー|scripts";
countItemsBy(pattern);
//-->
</script>

◆二番目の設置箇所のコード例：
リスト「スクリプト(JavaScript)」
（右の真中あたり）

<script type="text/javascript">
<!--
pattern = "FYI|検索|カレンダー|scripts|更新";
makeSwitchesBy(pattern);
//
pattern = "検索|カレンダー|scripts|更新";
foldContentsBy(pattern,"continued"); 
//
pattern = "FYI|検索|scripts";
countItemsBy(pattern);
//-->
</script>

◆３番目の設置箇所のコード例：
リスト「<!-- @bottom right -->」
（非表示ですが、実際は右下にあります。）

<script type="text/javascript">
<!--
pattern = "scripts-R0|utils|banners";
makeSwitchesBy(pattern);
//
pattern = "scripts-R0";
foldContentsBy(pattern);
//
pattern = "scripts-R0|utils|banners";
countItemsBy(pattern);
//
//-->
</script>

要点をまとめると、一回だけの設置と違うのは以下の二点です。

まず、最初以外では、コピー＆ペースト用の頭にある（myFunctions01a.jsとfoldSidebar02c.jsを呼び出している）二つのscriptタグは不要ということ。これは、ページの読み込み時間の改善に役立つでしょうか...。よくわかっていません(^^;

それから、最後以外で、 foldContentsBy(pattern); の行を foldContentsBy(pattern,"continued"); に変更するということ。これは、最初以外で指定しているリストの開閉状態を保持をさせるためには必須になってしまいました。よろしくお願いします_(._.)_

# したがって、以前の状態保持機能のないバージョン(foldSidebar02a.js)を設置されている方は、"continued"という引数は全く不要です。

----

以上ですが、いかがでしょうか。ご質問下は、お気軽に。

# 他にもまだ細かい機能がついているので、順次記事にしていきたいと思ってます。リクエストも大歓迎です(^^)