二〇〇五年 十二月 三十日（金）
サイドバー折りたたみ
[Blog記録]
過去の日記が増えたせいか、なんだかサイドバーが長い。
そうでなくてもいちいちスクロールして見るのが面倒なときにいらないものを隠すことができる。
サイドバーのメニューを折りたたんで、隠したり出したりするスクリプト。
ダイズバタケ: サイドバーを折りたたみ式にしてみた
以下、詳細。
folding_sidebar.js を用意してアップロード
function toggleFold(sender, id) {
var elm = document.getElementById(id);
if (elm.style.display == "none") {
elm.style.display = "block";
sender.className = "unfolded";
} else {
elm.style.display = "none";
sender.className = "folded";
}
<head>～</head>に追加
<!--サイドバー折り畳み-->
<script type="text/javascript" src="<$MTBlogURL$>folding_sidebar.js" charset="utf-8"></script>
テンプレートを以下のように書き換える。
<div class="folded" onmousedown="toggleFold(this, '●○');">タイトル</div>
<div id="●○" style="display: block;">
隠したい内容
</div>
●○の部分は、折りたたみを複数のメニューで使いたいときに個別の名前を付けて管理する。
display: block;だと最初は出してある。
display: none;だと最初は隠してある。
お好みで。