サイドバーを一部折りたたみ化しました。
思ったより手こずって2日つぶれたけど・・・orz
おまけにバグあり・・・
なんかデフォルトで開いているものを閉じる際に
1回目のクリックが無反応。
でも調査する気力も尽きました・・・。
参考にしたのは先駆け防忘録さんのこちらの記事。
他の手段は正直挫折しました。
確かにこれが一番簡単かも・・・
そのままだと、デフォルトでは全て閉じた状態になるので
少し手を加えてデフォルトで開いた状態も可能にしました。
手を加えたといっても少しだけですが、
if(document.getElementById){
document.writeln('<style type="text/css" media="all">');
document.writeln('<!--');
document.writeln('.sidehide{display:none}');
document.writeln('-->');
document.writeln('</style>');
}
if(document.getElementById){
document.writeln('<style type="text/css" media="all">');
document.writeln('<!--');
document.writeln('.sideview{display:block}');
document.writeln('-->');
document.writeln('</style>');
}
function showHide(id){
var disp = document.getElementById(id).style.display;
if(disp == "block"){
document.getElementById(id).style.display = "none";
}
else{
document.getElementById(id).style.display = "block";
}
return false;
}
function hideShow(id){
var disp = document.getElementById(id).style.display;
if(disp == "none"){
document.getElementById(id).style.display = "block";
}
else{
document.getElementById(id).style.display = "none";
}
return false;
}
上記のように赤色文字部分を加えただけです。
これでclass="sideview"でデフォルトオープンに
class="sidehide"でデフォルトクローズになります。
あとは、先駆け防忘録さんと同じ設定方法か
自由形式ならば頭に
<DIV class=sidetitle><a href="javascript:void(0);" onClick="showHide('AAA’);">サブタイトル</a></DIV>
<div class="sideview" id="AAA">
末尾に</div>をつけるだけです。
赤字の部分は適宜変更してください。
サブタイトルはこのブログで言えば「カウンタ」とか「ココロの部屋」にあたる部分です。
AAAは判別用ID。名前は何でもOKですが、両方とも同じ名前にする必要があります。
sideviewはデフォルトオープン、逆にクローズはsidehideです。
・・・ま、いつかはバグ取りが必要でしょうが、今回はここまででいいや。