blogger 3.0:从Shalafi Vos那里学到的新技巧关于折叠侧边栏

其实是从咖啡鱼最早写的在侧边栏展开收缩项目变种而来。原来的hack只能控制单一的侧边栏收缩和关闭。

Shalafi Vos增强了这个hack，让侧边栏可以打开的同时关闭另外一个已经打开的侧边栏项目。其实不该叫侧边栏，是任何被赋予特殊ID的<div>里面的内容。题外话：

Shalafi Vos的新博客已经做好了，大家可以去吸收点作博客的灵感。

修正的JS脚本代码：


var firstwhichpost=null;

function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") { whichpost.className="commenthidden"; } else { whichpost.className="commentshown"; }

if(firstwhichpost==null){firstwhichpost=whichpost;}

if(firstwhichpost!=null&&firstwhichpost!=whichpost){
firstwhichpost.className="commenthidden";
firstwhichpost=whichpost;
}
}

替换这个脚本代码即可。

要吃年饭，先收笔……

等会还要写怎么把完整的页面元素替换成可以收缩的样式，就像我的标签页面元素和归档页面元素。

吃完饭了，继续写……表问我怎么吃了3个小时@_@!

就说折叠侧边栏还有台湾朋友的无需脚本方法，不过如果要折叠的东西多了就会显得代码格外的多，或者要像我博客这样产生联动效果也是不行的。

好继续说如何折叠整个侧边栏，举个一般的侧边栏代码为例：

<b:widget id='HTML2' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><a aiotitle='点击展开' href='javascript:togglecomments("独一无二的ID")'><data:title/></a></h2>
</b:if>
<div class='commentshown' id='独一无二的ID'>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

红色部分，是要添加的，注意结尾的</div>是放在 <b:include name='quickedit'/>之后。

<div class='commentshown' id='独一无二的ID'>是定位在<div class='widget-content'>之前。

独一无二的ID是指英文字母和数字的不重复组合。<a aiotitle='点击展开' href='javascript:togglecomments("独一无二的ID")'>就是指示展开有相应ID的div内部的东东~~

非折叠整个侧边栏就很简单了，直接把要折叠的东西放进<div class='commentshown' id='独一无二的ID'>和</div>之间即可。commentshown表示一开始是打开的，点击关闭。改成commenthidden则相反。

已经写的很傻瓜级别了，有什么不懂再问哈。大家一起学习。再次感谢Shalafi Vos的指导，当时搞不清楚div结尾放哪里，还是 Shalafi Vos亲自帮我改的……汗，丢人啊……